<template>
	<div class="home-page">
		<!-- 顶部导航栏 -->
		<header class="header">
			<div class="header-content">
				<div class="logo">SKILLITH</div>
				<div class="header-right">
					<div class="header-actions">
					<!-- 近期推送按钮 -->
					<button class="recent-push-btn" @click="goToRecentPushes" v-if="currentTab === 'hall'">
						<div class="push-btn-content">
							<div class="push-icon-wrapper">
								<div class="push-icon">🔔</div>
								<view v-if="unreadPushCount > 0" class="push-badge">
									{{ unreadPushCount > 99 ? '99+' : unreadPushCount }}
								</view>
							</div>
							<div class="push-text">近期推送</div>
						</div>
					</button>
						<div class="user-info" @click="goToMyProfile" style="cursor:pointer;">
							<img :src="getAvatarUrl(safeUserProfile.avatarUrl)" class="avatar" @error="handleAvatarError" />

							<span>昵称: {{ safeUserProfile.nickname }}</span>
						</div>
					</div>
				</div>
			</div>
		</header>

		<!-- 搜索栏 -->
		<section class="search-section">
			<div class="search-container">
				<div class="search-input-wrapper">
					<input type="text" placeholder="搜索任务、公司、技能..." class="search-input" v-model="keyword"
						@keyup.enter="handleSearch" />
					<button class="search-btn" @click="handleSearch">
						<span class="search-icon">🔍</span>
					</button>
				</div>
			</div>
		</section>

		<!-- 任务切换标签 -->
		<section class="task-tabs">
			<div class="tab-container">
				<div class="tab-item" :class="{ active: currentTab === 'hall' }" @click="switchTab('hall')">
					<span>任务大厅</span>
				</div>
				<div class="tab-item" :class="{ active: currentTab === 'my' }" @click="switchTab('my')">
					<span>我的任务</span>
				</div>
			</div>
		</section>

		<!-- 发布任务按钮 -->
		<section class="publish-task-section" v-if="currentTab === 'hall'">
			<button class="publish-task-button" @click="goToPublishTask">
				<div class="button-content">
					<div class="button-icon">📝</div>
					<div class="button-text">
						<div class="button-title">发布任务</div>
						<div class="button-subtitle">分享你的需求，找到合适的人才</div>
					</div>
					<div class="button-arrow">→</div>
				</div>
			</button>
		</section>

		<!-- 快捷入口 -->
		<section class="quick-entry" v-if="currentTab === 'hall'">
			<div class="entry-grid">
				<div class="entry-item" @click="goToNewPeople">
					<div class="entry-icon publish-icon">🔥</div>
					<span class="entry-text">新人福利</span>
				</div>
				<div class="entry-item" @click="goCompany">
					<div class="entry-icon task-icon">💼</div>
					<span class="entry-text">企业认证</span>
				</div>
				<div class="entry-item" @click="goToSponsorship">
					<div class="entry-icon gift-icon">💰</div>
					<span class="entry-text">赞助榜</span>
				</div>
				<div class="entry-item" @click="goToApex">
					<div class="entry-icon chart-icon">📊</div>
					<span class="entry-text">人才榜</span>
				</div>
				<div class="entry-item" @click="goToEducation">
					<div class="entry-icon education-icon">🎓</div>
					<span class="entry-text">智索真源圈子</span>
				</div>
			</div>
		</section>
		<!-- 地区选择和类别选择 -->
		<section class="info-cards" v-if="currentTab === 'hall'">
			<div class="info-card nearby-card" @click="openRegionSelector">
				<div class="info-icon">📍</div>
				<div class="info-content">
					<div class="info-title">地区选择</div>
					<div class="info-desc">地图找工作</div>
				</div>
			</div>
			<div class="info-card message-card" @click="openTypeSelector">
				<div class="info-icon">🔔</div>
				<div class="info-content">
					<div class="info-title">类别选择</div>
					<div class="info-desc">方向更适合</div>
				</div>

			</div>
		</section>
		<!-- 筛选区 -->
		<section class="info-cards" v-if="currentTab === 'hall'">
			<div class="info-card time-filter-card" @click="openTimeFilter">
				<div class="info-content">
					<div class="info-title">时间筛选</div>
					<div class="info-desc">{{ getTimeFilterText() }}</div>
				</div>
			</div>
			<div class="info-card badge-filter-card" @click="openBadgeFilter">
				<div class="info-content">
					<div class="info-title">铭牌等级</div>
					<div class="info-desc">{{ getBadgeFilterText() }}</div>
				</div>
			</div>
			<div class="info-card sort-filter-card" @click="openSortFilter">
				<div class="info-content">
					<div class="info-title">排序</div>
					<div class="info-desc">{{ getSortFilterText() }}</div>
				</div>
			</div>
		</section>
		
		<!-- 我的任务筛选区 -->
		<section class="info-cards" v-if="currentTab === 'my'">
			<div class="info-card nearby-card" @click="openMyTaskRegionSelector">
				<div class="info-content">
					<div class="info-title">地区选择</div>
					<div class="info-desc">{{ getMyTaskRegionText() }}</div>
				</div>
			</div>
			<div class="info-card message-card" @click="openMyTaskTypeSelector">
				<div class="info-content">
					<div class="info-title">类别选择</div>
					<div class="info-desc">{{ getMyTaskTypeText() }}</div>
				</div>
			</div>
		</section>
		
		<section class="info-cards" v-if="currentTab === 'my'">
			<div class="info-card time-filter-card" @click="openMyTaskTimeFilter">
				<div class="info-content">
					<div class="info-title">时间筛选</div>
					<div class="info-desc">{{ getMyTaskTimeFilterText() }}</div>
				</div>
			</div>
			<div class="info-card badge-filter-card" @click="openMyTaskBadgeFilter">
				<div class="info-content">
					<div class="info-title">铭牌等级</div>
					<div class="info-desc">{{ getMyTaskBadgeFilterText() }}</div>
				</div>
			</div>
			<div class="info-card sort-filter-card" @click="openMyTaskSortFilter">
				<div class="info-content">
					<div class="info-title">排序</div>
					<div class="info-desc">{{ getMyTaskSortFilterText() }}</div>
				</div>
			</div>
		</section>
		<!-- 类别弹窗 -->
		<div v-if="showTypeSelector" class="region-popup-mask" @click.self="showTypeSelector = false">
			<div class="region-popup" @click.stop>
				<div class="region-picker-header">
					<span class="region-picker-cancel" @click="showTypeSelector = false">取消</span>
					<span class="region-picker-title">请选择类型</span>
					<span class="region-picker-confirm" @click="confirmType">确认</span>
				</div>
				<div class="region-columns">
					<!-- 领域 -->
					<div class="region-list-wrapper">
						<div class="gradient-top"></div>
						<ul class="region-list">
							<li :class="{active: tempField === ''}" @click="selectTempField('')">全部</li>
							<li v-for="field in fields" :key="field.code" :class="{active: field.code === tempField}" @click="selectTempField(field.code)">
								{{ field.name }}
							</li>
						</ul>
						<div class="gradient-bottom"></div>
					</div>
					<!-- 大类 -->
					<div class="region-list-wrapper">
						<div class="gradient-top"></div>
						<ul class="region-list">
							<li :class="{active: tempCategory === ''}" @click="selectTempCategory('')">全部</li>
							<li v-for="category in (fields.find(f => f.code === tempField)?.subcategories || [])" :key="category.code" :class="{active: category.code === tempCategory}" @click="selectTempCategory(category.code)">
								{{ category.name }}
							</li>
						</ul>
						<div class="gradient-bottom"></div>
					</div>
					<!-- 方向 -->
					<div class="region-list-wrapper">
						<div class="gradient-top"></div>
						<ul class="region-list">
							<li :class="{active: tempDirection === ''}" @click="selectTempDirection('')">全部</li>
							<li v-for="direction in ((() => { const f = fields.find(f => f.code === tempField); const c = f?.subcategories.find(c => c.code === tempCategory); return c?.directions || []; })())" :key="direction.code" :class="{active: direction.code === tempDirection}" @click="selectTempDirection(direction.code)">
								{{ direction.name }}
							</li>
						</ul>
						<div class="gradient-bottom"></div>
					</div>
				</div>
			</div>
		</div>
		<!-- 区域选择弹窗 -->
		<!-- 区域选择弹窗 -->
		<view v-if="showRegionSelector" class="region-popup-mask" @tap.self="showRegionSelector = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showRegionSelector = false">取消</text>
					<text class="region-picker-title">
						<template v-if="tempProvince || tempCity || tempDistrict">
							{{ tempProvince || '全部' }}<text v-if="tempCity"> / {{ tempCity }}</text><text v-if="tempDistrict"> / {{ tempDistrict.name }}</text>
						</template>
						<template v-else>
							请选择地区
						</template>
					</text>
					<text
						class="region-picker-confirm"
						:class="{disabled: !tempProvince && !tempCity && !tempDistrict}"
						@tap="confirmRegion"
					>
						确认
					</text>
				</view>
				<view class="region-columns">
					<view class="region-list-wrapper">
						<view class="gradient-top"></view>
						<view class="region-list province-list">
							<view :class="{active: tempProvince === ''}" @tap="selectTempProvince('')">全部</view>
							<view v-for="province in provinces" :key="province" :class="{active: province === tempProvince}" @tap="selectTempProvince(province)">
								{{ province }}
							</view>
						</view>
						<view class="gradient-bottom"></view>
					</view>
					<view class="region-list-wrapper">
						<view class="gradient-top"></view>
						<view class="region-list city-list">
							<view :class="{active: tempCity === ''}" @tap="selectTempCity('')">全部</view>
							<view v-for="city in (geoData.find(p => p.name === tempProvince)?.cities.map(c => c.name) || [])" :key="city" :class="{active: city === tempCity}" @tap="selectTempCity(city)">
								{{ city }}
							</view>
						</view>
						<view class="gradient-bottom"></view>
					</view>
					<view class="region-list-wrapper">
						<view class="gradient-top"></view>
						<view class="region-list district-list">
							<view :class="{active: tempDistrict === null || tempDistrict === ''}" @tap="selectTempDistrict(null)">全部</view>
							<view v-for="district in ((() => { const p = geoData.find(p => p.name === tempProvince); const c = p?.cities.find(c => c.name === tempCity); return c?.districts || []; })())" :key="district.adcode" :class="{active: district.name === tempDistrict?.name}" @tap="selectTempDistrict(district)">{{ district.name }}</view>
						</view>
						<view class="gradient-bottom"></view>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 时间筛选弹窗 -->
		<view v-if="showTimeFilter" class="region-popup-mask" @tap.self="showTimeFilter = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showTimeFilter = false">取消</text>
					<text class="region-picker-title">时间筛选</text>
					<text class="region-picker-confirm" @tap="confirmTimeFilter">确认</text>
				</view>
				<view class="time-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">发布时间</text>
							<button class="clear-section-btn" @click="clearPublishTimeFilter">清除</button>
						</view>
						<view class="time-input-group">
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">开始时间</text>
									<button class="clear-single-btn" @click="clearStartPublishDate" v-if="tempStartPublishDate">×</button>
								</view>
								<picker mode="date" :value="tempStartPublishDate" @change="onStartPublishDateChange">
									<view class="time-picker">{{ tempStartPublishDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">结束时间</text>
									<button class="clear-single-btn" @click="clearEndPublishDate" v-if="tempEndPublishDate">×</button>
								</view>
								<picker mode="date" :value="tempEndPublishDate" @change="onEndPublishDateChange">
									<view class="time-picker">{{ tempEndPublishDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
						</view>
					</view>
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">截止时间</text>
							<button class="clear-section-btn" @click="clearDeadlineTimeFilter">清除</button>
						</view>
						<view class="time-input-group">
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">开始时间</text>
									<button class="clear-single-btn" @click="clearStartDeadlineDate" v-if="tempStartDeadlineDate">×</button>
								</view>
								<picker mode="date" :value="tempStartDeadlineDate" @change="onStartDeadlineDateChange">
									<view class="time-picker">{{ tempStartDeadlineDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">结束时间</text>
									<button class="clear-single-btn" @click="clearEndDeadlineDate" v-if="tempEndDeadlineDate">×</button>
								</view>
								<picker mode="date" :value="tempEndDeadlineDate" @change="onEndDeadlineDateChange">
									<view class="time-picker">{{ tempEndDeadlineDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearTimeFilter">清除筛选</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 铭牌等级筛选弹窗 -->
		<view v-if="showBadgeFilter" class="region-popup-mask" @tap.self="showBadgeFilter = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showBadgeFilter = false">取消</text>
					<text class="region-picker-title">铭牌等级筛选</text>
					<text class="region-picker-confirm" @tap="confirmBadgeFilter">确认</text>
				</view>
				<view class="badge-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">铭牌等级范围</text>
							<button class="clear-section-btn" @click="clearBadgeLevelFilter">清除</button>
						</view>
						<view class="level-input-group">
							<view class="level-input-item">
								<view class="level-input-header">
									<text class="level-label">最低等级</text>
									<button class="clear-single-btn" @click="clearMinLevel" v-if="tempMinLevel">×</button>
								</view>
								<input 
									type="number" 
									v-model.number="tempMinLevel" 
									placeholder="1（可选）" 
									min="1" 
									max="20"
									class="level-input"
								/>
							</view>
							<view class="level-input-item">
								<view class="level-input-header">
									<text class="level-label">最高等级</text>
									<button class="clear-single-btn" @click="clearMaxLevel" v-if="tempMaxLevel">×</button>
								</view>
								<input 
									type="number" 
									v-model.number="tempMaxLevel" 
									placeholder="20（可选）" 
									min="1" 
									max="20"
									class="level-input"
								/>
							</view>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearBadgeFilter">清除所有筛选</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 排序选择弹窗 -->
		<view v-if="showSortSelector" class="region-popup-mask" @tap.self="showSortSelector = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showSortSelector = false">取消</text>
					<text class="region-picker-title">排序方式</text>
					<text class="region-picker-confirm" @tap="confirmSortFilter">确认</text>
				</view>
				<view class="sort-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">排序字段</text>
						</view>
						<view class="sort-options">
							<view 
								class="sort-option" 
								:class="{ active: sortBy === '' }" 
								@tap="setSortBy('')"
							>
								<text>默认排序</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: sortBy === 'publishTime' }" 
								@tap="setSortBy('publishTime')"
							>
								<text>发布时间</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: sortBy === 'deadline' }" 
								@tap="setSortBy('deadline')"
							>
								<text>截止时间</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: sortBy === 'reward' }" 
								@tap="setSortBy('reward')"
							>
								<text>奖励金额</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: sortBy === 'level' }" 
								@tap="setSortBy('level')"
							>
								<text>技能等级</text>
							</view>
						</view>
					</view>
					<view class="filter-section" v-if="sortBy">
						<view class="filter-section-header">
							<text class="filter-section-title">排序方向</text>
						</view>
						<view class="sort-direction-options">
							<view 
								class="sort-direction-option" 
								:class="{ active: sortDirection === 'DESC' }" 
								@tap="setSortDirection('DESC')"
							>
								<text>降序（新→旧，高→低）</text>
							</view>
							<view 
								class="sort-direction-option" 
								:class="{ active: sortDirection === 'ASC' }" 
								@tap="setSortDirection('ASC')"
							>
								<text>升序（旧→新，低→高）</text>
							</view>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearSortFilter">清除排序</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 我的任务时间筛选弹窗 -->
		<view v-if="showMyTaskTimeFilter" class="region-popup-mask" @tap.self="showMyTaskTimeFilter = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showMyTaskTimeFilter = false">取消</text>
					<text class="region-picker-title">我的任务时间筛选</text>
					<text class="region-picker-confirm" @tap="confirmMyTaskTimeFilter">确认</text>
				</view>
				<view class="time-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">发布时间</text>
							<button class="clear-section-btn" @click="clearMyTaskPublishTimeFilter">清除</button>
						</view>
						<view class="time-input-group">
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">开始时间</text>
									<button class="clear-single-btn" @click="clearMyTaskStartPublishDate" v-if="tempMyTaskStartPublishDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskStartPublishDate" @change="onMyTaskStartPublishDateChange">
									<view class="time-picker">{{ tempMyTaskStartPublishDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">结束时间</text>
									<button class="clear-single-btn" @click="clearMyTaskEndPublishDate" v-if="tempMyTaskEndPublishDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskEndPublishDate" @change="onMyTaskEndPublishDateChange">
									<view class="time-picker">{{ tempMyTaskEndPublishDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
						</view>
					</view>
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">截止时间</text>
							<button class="clear-section-btn" @click="clearMyTaskDeadlineTimeFilter">清除</button>
						</view>
						<view class="time-input-group">
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">开始时间</text>
									<button class="clear-single-btn" @click="clearMyTaskStartDeadlineDate" v-if="tempMyTaskStartDeadlineDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskStartDeadlineDate" @change="onMyTaskStartDeadlineDateChange">
									<view class="time-picker">{{ tempMyTaskStartDeadlineDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">结束时间</text>
									<button class="clear-single-btn" @click="clearMyTaskEndDeadlineDate" v-if="tempMyTaskEndDeadlineDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskEndDeadlineDate" @change="onMyTaskEndDeadlineDateChange">
									<view class="time-picker">{{ tempMyTaskEndDeadlineDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
						</view>
					</view>
					<view class="filter-section" v-if="(myTaskType === 'challenge' && (myTaskFilters.status === '2' || myTaskFilters.status === '3' || myTaskFilters.status === '')) || (myTaskType === 'published' && (myTaskFilters.status === '2' || myTaskFilters.status === '3' || myTaskFilters.status === ''))">
						<view class="filter-section-header">
							<text class="filter-section-title">接取时间</text>
							<button class="clear-section-btn" @click="clearMyTaskAcceptTimeFilter">清除</button>
						</view>
						<view class="time-input-group">
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">开始时间</text>
									<button class="clear-single-btn" @click="clearMyTaskStartAcceptDate" v-if="tempMyTaskStartAcceptDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskStartAcceptDate" @change="onMyTaskStartAcceptDateChange">
									<view class="time-picker">{{ tempMyTaskStartAcceptDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">结束时间</text>
									<button class="clear-single-btn" @click="clearMyTaskEndAcceptDate" v-if="tempMyTaskEndAcceptDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskEndAcceptDate" @change="onMyTaskEndAcceptDateChange">
									<view class="time-picker">{{ tempMyTaskEndAcceptDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
						</view>
					</view>
					<view class="filter-section" v-if="(myTaskType === 'challenge' && myTaskFilters.status === '3') || (myTaskType === 'published' && myTaskFilters.status === '3') || (myTaskFilters.status === '')">
						<view class="filter-section-header">
							<text class="filter-section-title">完成时间</text>
							<button class="clear-section-btn" @click="clearMyTaskCompleteTimeFilter">清除</button>
						</view>
						<view class="time-input-group">
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">开始时间</text>
									<button class="clear-single-btn" @click="clearMyTaskStartCompleteDate" v-if="tempMyTaskStartCompleteDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskStartCompleteDate" @change="onMyTaskStartCompleteDateChange">
									<view class="time-picker">{{ tempMyTaskStartCompleteDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
							<view class="time-input-item">
								<view class="time-input-header">
									<text class="time-label">结束时间</text>
									<button class="clear-single-btn" @click="clearMyTaskEndCompleteDate" v-if="tempMyTaskEndCompleteDate">×</button>
								</view>
								<picker mode="date" :value="tempMyTaskEndCompleteDate" @change="onMyTaskEndCompleteDateChange">
									<view class="time-picker">{{ tempMyTaskEndCompleteDate || '选择日期（可选）' }}</view>
								</picker>
							</view>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearMyTaskTimeFilter">清除筛选</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 我的任务铭牌等级筛选弹窗 -->
		<view v-if="showMyTaskBadgeFilter" class="region-popup-mask" @tap.self="showMyTaskBadgeFilter = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showMyTaskBadgeFilter = false">取消</text>
					<text class="region-picker-title">我的任务铭牌等级筛选</text>
					<text class="region-picker-confirm" @tap="confirmMyTaskBadgeFilter">确认</text>
				</view>
				<view class="badge-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">铭牌等级范围</text>
							<button class="clear-section-btn" @click="clearMyTaskBadgeLevelFilter">清除</button>
						</view>
						<view class="level-input-group">
							<view class="level-input-item">
								<view class="level-input-header">
									<text class="level-label">最低等级</text>
									<button class="clear-single-btn" @click="clearMyTaskMinLevel" v-if="tempMyTaskMinLevel">×</button>
								</view>
								<input 
									type="number" 
									v-model.number="tempMyTaskMinLevel" 
									placeholder="1（可选）" 
									min="1" 
									max="20"
									class="level-input"
								/>
							</view>
							<view class="level-input-item">
								<view class="level-input-header">
									<text class="level-label">最高等级</text>
									<button class="clear-single-btn" @click="clearMyTaskMaxLevel" v-if="tempMyTaskMaxLevel">×</button>
								</view>
								<input 
									type="number" 
									v-model.number="tempMyTaskMaxLevel" 
									placeholder="20（可选）" 
									min="1" 
									max="20"
									class="level-input"
								/>
							</view>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearMyTaskBadgeFilter">清除所有筛选</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 我的任务排序选择弹窗 -->
		<view v-if="showMyTaskSortSelector" class="region-popup-mask" @tap.self="showMyTaskSortSelector = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showMyTaskSortSelector = false">取消</text>
					<text class="region-picker-title">我的任务排序方式</text>
					<text class="region-picker-confirm" @tap="confirmMyTaskSortFilter">确认</text>
				</view>
				<view class="sort-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">排序字段</text>
						</view>
						<view class="sort-options">
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === '' }" 
								@tap="setMyTaskSortBy('')"
							>
								<text>默认排序</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === 'publishTime' }" 
								@tap="setMyTaskSortBy('publishTime')"
							>
								<text>发布时间</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === 'deadline' }" 
								@tap="setMyTaskSortBy('deadline')"
							>
								<text>截止时间</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === 'reward' }" 
								@tap="setMyTaskSortBy('reward')"
							>
								<text>奖励金额</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === 'level' }" 
								@tap="setMyTaskSortBy('level')"
							>
								<text>技能等级</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === 'challengeStartTime' }" 
								@tap="setMyTaskSortBy('challengeStartTime')"
								v-if="(myTaskType === 'challenge' && (myTaskFilters.status === '2' || myTaskFilters.status === '3' || myTaskFilters.status === '')) || (myTaskType === 'published' && (myTaskFilters.status === '2' || myTaskFilters.status === '3' || myTaskFilters.status === ''))"
							>
								<text>接取时间</text>
							</view>
							<view 
								class="sort-option" 
								:class="{ active: myTaskSortBy === 'challengeEndTime' }" 
								@tap="setMyTaskSortBy('challengeEndTime')"
								v-if="(myTaskType === 'challenge' && myTaskFilters.status === '3') || (myTaskType === 'published' && myTaskFilters.status === '3') || (myTaskFilters.status === '')"
							>
								<text>完成时间</text>
							</view>
						</view>
					</view>
					<view class="filter-section" v-if="myTaskSortBy">
						<view class="filter-section-header">
							<text class="filter-section-title">排序方向</text>
						</view>
						<view class="sort-direction-options">
							<view 
								class="sort-direction-option" 
								:class="{ active: myTaskSortDirection === 'DESC' }" 
								@tap="setMyTaskSortDirection('DESC')"
							>
								<text>降序（新→旧，高→低）</text>
							</view>
							<view 
								class="sort-direction-option" 
								:class="{ active: myTaskSortDirection === 'ASC' }" 
								@tap="setMyTaskSortDirection('ASC')"
							>
								<text>升序（旧→新，低→高）</text>
							</view>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearMyTaskSortFilter">清除排序</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 我的任务团队人数区间选择弹窗 -->
		<view v-if="showTeamMemberCountRangeSelector" class="region-popup-mask" @tap.self="showTeamMemberCountRangeSelector = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showTeamMemberCountRangeSelector = false">取消</text>
					<text class="region-picker-title">团队人数区间选择</text>
					<text class="region-picker-confirm" @tap="confirmCustomRange">确认</text>
				</view>
				<view class="badge-filter-content">
					<view class="filter-section">
						<view class="filter-section-header">
							<text class="filter-section-title">人数范围</text>
							<button class="clear-section-btn" @click="clearCustomRange" v-if="customMinMemberCount || customMaxMemberCount">清除</button>
						</view>
						<view class="level-input-group">
							<view class="level-input-item">
								<view class="level-input-header">
									<text class="level-label">最低人数</text>
									<button class="clear-single-btn" @click="customMinMemberCount = ''" v-if="customMinMemberCount">×</button>
								</view>
								<input 
									type="number" 
									v-model.number="customMinMemberCount" 
									placeholder="例如：1（可选）" 
									min="1" 
									class="level-input"
									@input="validateCustomRange"
								/>
							</view>
							<view class="level-input-item">
								<view class="level-input-header">
									<text class="level-label">最高人数</text>
									<button class="clear-single-btn" @click="customMaxMemberCount = ''" v-if="customMaxMemberCount">×</button>
								</view>
								<input 
									type="number" 
									v-model.number="customMaxMemberCount" 
									placeholder="例如：5（可选）" 
									min="1" 
									class="level-input"
									@input="validateCustomRange"
								/>
							</view>
						</view>
						<view class="range-hint-section">
							<text class="range-hint-text">说明：</text>
							<text class="range-hint-item">• 只填最低人数：表示该人数及以上</text>
							<text class="range-hint-item">• 只填最高人数：表示1人至该人数</text>
							<text class="range-hint-item">• 两者都填：表示该范围（包含边界）</text>
						</view>
					</view>
					<view class="filter-actions">
						<button class="clear-filter-btn" @click="clearCustomRange">清除筛选</button>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 我的任务地区选择弹窗 -->
		<view v-if="showMyTaskRegionSelector" class="region-popup-mask" @tap.self="showMyTaskRegionSelector = false">
			<view class="region-popup" @tap.stop>
				<view class="region-picker-header">
					<text class="region-picker-cancel" @tap="showMyTaskRegionSelector = false">取消</text>
					<text class="region-picker-title">
						<template v-if="tempMyTaskProvince || tempMyTaskCity || tempMyTaskDistrict">
							{{ tempMyTaskProvince || '全部' }}<text v-if="tempMyTaskCity"> / {{ tempMyTaskCity }}</text><text v-if="tempMyTaskDistrict"> / {{ tempMyTaskDistrict.name }}</text>
						</template>
						<template v-else>
							请选择地区
						</template>
					</text>
					<text
						class="region-picker-confirm"
						:class="{disabled: !tempMyTaskProvince && !tempMyTaskCity && !tempMyTaskDistrict}"
						@tap="confirmMyTaskRegion"
					>
						确认
					</text>
				</view>
				<view class="region-columns">
					<view class="region-list-wrapper">
						<view class="gradient-top"></view>
						<view class="region-list province-list">
							<view :class="{active: tempMyTaskProvince === ''}" @tap="selectTempMyTaskProvince('')">全部</view>
							<view v-for="province in provinces" :key="province" :class="{active: province === tempMyTaskProvince}" @tap="selectTempMyTaskProvince(province)">
								{{ province }}
							</view>
						</view>
						<view class="gradient-bottom"></view>
					</view>
					<view class="region-list-wrapper">
						<view class="gradient-top"></view>
						<view class="region-list city-list">
							<view :class="{active: tempMyTaskCity === ''}" @tap="selectTempMyTaskCity('')">全部</view>
							<view v-for="city in (geoData.find(p => p.name === tempMyTaskProvince)?.cities.map(c => c.name) || [])" :key="city" :class="{active: city === tempMyTaskCity}" @tap="selectTempMyTaskCity(city)">
								{{ city }}
							</view>
						</view>
						<view class="gradient-bottom"></view>
					</view>
					<view class="region-list-wrapper">
						<view class="gradient-top"></view>
						<view class="region-list district-list">
							<view :class="{active: tempMyTaskDistrict === null || tempMyTaskDistrict === ''}" @tap="selectTempMyTaskDistrict(null)">全部</view>
							<view v-for="district in ((() => { const p = geoData.find(p => p.name === tempMyTaskProvince); const c = p?.cities.find(c => c.name === tempMyTaskCity); return c?.districts || []; })())" :key="district.adcode" :class="{active: district.name === tempMyTaskDistrict?.name}" @tap="selectTempMyTaskDistrict(district)">{{ district.name }}</view>
						</view>
						<view class="gradient-bottom"></view>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 我的任务类别选择弹窗 -->
		<div v-if="showMyTaskTypeSelector" class="region-popup-mask" @click.self="showMyTaskTypeSelector = false">
			<div class="region-popup" @click.stop>
				<div class="region-picker-header">
					<span class="region-picker-cancel" @click="showMyTaskTypeSelector = false">取消</span>
					<span class="region-picker-title">请选择类型</span>
					<span class="region-picker-confirm" @click="confirmMyTaskType">确认</span>
				</div>
				<div class="region-columns">
					<!-- 领域 -->
					<div class="region-list-wrapper">
						<div class="gradient-top"></div>
						<ul class="region-list">
							<li :class="{active: tempMyTaskField === ''}" @click="selectTempMyTaskField('')">全部</li>
							<li v-for="field in fields" :key="field.code" :class="{active: field.code === tempMyTaskField}" @click="selectTempMyTaskField(field.code)">
								{{ field.name }}
							</li>
						</ul>
						<div class="gradient-bottom"></div>
					</div>
					<!-- 大类 -->
					<div class="region-list-wrapper">
						<div class="gradient-top"></div>
						<ul class="region-list">
							<li :class="{active: tempMyTaskCategory === ''}" @click="selectTempMyTaskCategory('')">全部</li>
							<li v-for="category in (fields.find(f => f.code === tempMyTaskField)?.subcategories || [])" :key="category.code" :class="{active: category.code === tempMyTaskCategory}" @click="selectTempMyTaskCategory(category.code)">
								{{ category.name }}
							</li>
						</ul>
						<div class="gradient-bottom"></div>
					</div>
					<!-- 方向 -->
					<div class="region-list-wrapper">
						<div class="gradient-top"></div>
						<ul class="region-list">
							<li :class="{active: tempMyTaskDirection === ''}" @click="selectTempMyTaskDirection('')">全部</li>
							<li v-for="direction in ((() => { const f = fields.find(f => f.code === tempMyTaskField); const c = f?.subcategories.find(c => c.code === tempMyTaskCategory); return c?.directions || []; })())" :key="direction.code" :class="{active: direction.code === tempMyTaskDirection}" @click="selectTempMyTaskDirection(direction.code)">
								{{ direction.name }}
							</li>
						</ul>
						<div class="gradient-bottom"></div>
					</div>
				</div>
			</div>
		</div>
		
		<!-- 任务列表 -->
		<div class="task-list" v-if="currentTab === 'hall'">
			<div v-for="task in tasks" :key="task.taskId" class="task-item" @click="goToTaskDetail(task.taskId)">
				<!-- 任务卡片头部 -->
				<div class="task-card-header">
					<!-- 左侧：头像和基本信息 -->
					<div class="task-left-section">
						<div class="publisher-avatar-section" @click.stop="task.publisherId && goToUserProfile(task.publisherId)">
							<img :src="getAvatarUrl(task.userAvatar)" alt="头像" class="publisher-avatar" @error="handleTaskAvatarError" />
						</div>
						<div class="task-basic-info">
							<h3 class="task-title">{{ task.title }}</h3>
							<div class="org-name" 
								v-if="task.orgName && task.creditCode" 
								@click.stop="goToOrganization(task.creditCode)">
								{{ task.orgName }}
							</div>
							<div class="org-name" v-else>{{ task.orgName || '未知企业' }}</div>
						</div>
					</div>
					
					<!-- 右侧：薪资 -->
					<div class="task-salary-section">
						<div class="task-salary">{{ formatReward(task.reward) }}元</div>
					</div>
				</div>

				<!-- 任务描述 -->
				<div class="task-description-section">
					<p class="task-description">
						{{ task.description.length > 80 ? task.description.substring(0, 80) + '...' : task.description }}
					</p>
				</div>

				<!-- 任务时间信息 -->
				<div class="task-time-info">
					<div class="time-item">
						<span class="time-icon">📅</span>
						<span class="time-label">发布时间：</span>
						<span class="time-value">{{ formatDateTime(task.publishTime) }}</span>
					</div>
					<div class="time-item">
						<span class="time-icon">⏰</span>
						<span class="time-label">截止时间：</span>
						<span class="time-value">{{ formatDateTime(task.deadline) }}</span>
					</div>
				</div>

				<!-- 任务卡片底部 -->
				<div class="task-card-footer">
					<!-- 左侧：发布者信息 -->
					<div class="publisher-info" @click.stop="task.publisherId && goToUserProfile(task.publisherId)">
						<span class="publisher-name">{{ task.publisherName || task.userName || '未知用户' }}</span>
					</div>
					
					<!-- 右侧：位置和距离信息 -->
					<div class="location-info">
						<div class="location-item">
							<span class="location-icon">📍</span>
							<span class="location-text">{{ getLocationName(task.adCode) || '未知地区' }}</span>
						</div>
						<div class="distance-item">
							<span class="distance-icon">📏</span>
							<span class="distance-text">{{ task.distance }}</span>
						</div>
					</div>
				</div>

				<!-- 任务徽章 -->
				<div class="task-reward-badges">
					<div class="task-badges">
						<p v-if="task.badges && task.badges.length > 0">
							<span 
								v-for="badge in task.badges" 
								:key="badge.id" 
								class="badge"
								:data-level="badge.level"
								:title="`${getBadgeName(badge.association)} 等级 ${badge.level}`"
							>
								{{ getBadgeName(badge.association) }} Lv{{ badge.level }}
							</span>
						</p>
						<p v-else class="no-badges">当前任务无徽章</p>
					</div>
				</div>
			</div>
		</div>

		<!-- 我的任务部分 -->
		<div class="my-task-section" v-if="currentTab === 'my'">
			<!-- 任务类型切换 -->
			<div class="task-type-tabs">
				<div class="type-tab" :class="{ active: myTaskType === 'published' }" @click="switchMyTaskType('published')">
					<span>我发布的任务</span>
				</div>
				<div class="type-tab" :class="{ active: myTaskType === 'challenge' }" @click="switchMyTaskType('challenge')">
					<span>我挑战的任务</span>
				</div>
			</div>

			<!-- 我的任务筛选 -->
			<div class="my-task-filters">
				<div class="filter-chips">
					<div class="filter-chip" :class="{ active: myTaskFilters.status === '' }" @click="setMyTaskStatus('')">
						<span>全部状态</span>
					</div>
					<!-- 我发布的任务显示所有状态 -->
					<template v-if="myTaskType === 'published'">
						<div class="filter-chip" :class="{ active: myTaskFilters.status === '0' }" @click="setMyTaskStatus('0')">
							<span>待审核</span>
						</div>
						<div class="filter-chip" :class="{ active: myTaskFilters.status === '1' }" @click="setMyTaskStatus('1')">
							<span>已发布</span>
						</div>
					</template>
					<!-- 我挑战的任务不显示待审核和已发布状态 -->
					<div class="filter-chip" :class="{ active: myTaskFilters.status === '2' }" @click="setMyTaskStatus('2')">
						<span>进行中</span>
					</div>
					<div class="filter-chip" :class="{ active: myTaskFilters.status === '3' }" @click="setMyTaskStatus('3')">
						<span>已完成</span>
					</div>
				</div>
				
				<!-- 组队角色筛选（仅在我挑战的任务中显示，所有任务都是团队任务） -->
				<div v-if="myTaskType === 'challenge'" class="team-role-filters">
						<div class="filter-section-title">
							<span class="filter-title-icon">👑</span>
							<span class="filter-title-text">我的角色</span>
						</div>
						<div class="role-filter-chips">
							<div class="role-filter-chip" :class="{ active: myTaskFilters.teamRole === null || myTaskFilters.teamRole === '' }" @click="setTeamRole('')">
								<span class="chip-icon">🔍</span>
								<span>全部角色</span>
							</div>
							<div class="role-filter-chip" :class="{ active: myTaskFilters.teamRole === '1' }" @click="setTeamRole('leader')">
								<span class="chip-icon">👑</span>
								<span>我是队长</span>
							</div>
							<div class="role-filter-chip" :class="{ active: myTaskFilters.teamRole === '0' }" @click="setTeamRole('member')">
								<span class="chip-icon">🤝</span>
								<span>我是队员</span>
							</div>
						</div>
					</div>
				
				<!-- 团队人数筛选（我发布的任务和我挑战的任务都显示） -->
				<div class="team-member-count-filters">
					<div class="filter-section-title">
						<span class="filter-title-icon">👥</span>
						<span class="filter-title-text">团队人数</span>
					</div>
					<div class="member-count-filter-chips">
						<div class="member-count-filter-chip" :class="{ active: myTaskFilters.teamMemberCount === null || myTaskFilters.teamMemberCount === '' }" @click="setTeamMemberCount('')">
							<span class="chip-icon">🔍</span>
							<span>全部人数</span>
						</div>
						<div class="member-count-filter-chip" :class="{ active: myTaskFilters.teamMemberCount === '1' }" @click="setTeamMemberCount('1')">
							<span class="chip-icon">1️⃣</span>
							<span>单人</span>
						</div>
						<div class="member-count-filter-chip" :class="{ active: myTaskFilters.teamMemberCount === '2' }" @click="setTeamMemberCount('2')">
							<span class="chip-icon">2️⃣</span>
							<span>双人</span>
						</div>
						<div class="member-count-filter-chip" :class="{ active: myTaskFilters.teamMemberCount === '3+' }" @click="setTeamMemberCount('3+')">
							<span class="chip-icon">👥</span>
							<span>多人</span>
						</div>
						<div class="member-count-filter-chip range-chip" :class="{ active: myTaskFilters.teamMemberCount && myTaskFilters.teamMemberCount.startsWith('range:') }" @click="openTeamMemberCountRangeSelector">
							<span class="chip-icon">📊</span>
							<span>区间选择</span>
							<span v-if="myTaskFilters.teamMemberCount && myTaskFilters.teamMemberCount.startsWith('range:')" class="range-display">
								{{ getRangeDisplayText(myTaskFilters.teamMemberCount) }}
							</span>
						</div>
					</div>
				</div>
			</div>

			<!-- 我的任务列表 -->
			<div class="my-task-list">
				<div v-if="myTasksLoading" class="loading-spinner">
					<span class="spinner"></span>
				</div>
				<div v-else-if="myTasks.length" class="task-list-new">
					<div v-for="task in myTasks" :key="task.taskId" class="task-card" @click="goToTaskDetail(task.taskId)">
						<div class="task-card-header">
							<h3 class="task-title-new">{{ task.title }}</h3>
							<div class="task-salary-new">{{ formatReward(task.reward) }}元</div>
						</div>
						<p class="task-desc-new">{{ task.description.length > 100 ? task.description.substring(0, 100) + '...' : task.description }}</p>
						
						<!-- 我的任务时间信息 -->
						<div class="my-task-time-info">
							<div class="my-time-item">
								<span class="my-time-icon">📅</span>
								<span class="my-time-label">发布时间：</span>
								<span class="my-time-value">{{ formatDateTime(task.publishTime) }}</span>
							</div>
							<div class="my-time-item">
								<span class="my-time-icon">⏰</span>
								<span class="my-time-label">截止时间：</span>
								<span class="my-time-value">{{ formatDateTime(task.deadline) }}</span>
							</div>
							<div class="my-time-item" v-if="task.challengeStartTime">
								<span class="my-time-icon">🎯</span>
								<span class="my-time-label">接取时间：</span>
								<span class="my-time-value">{{ formatDateTime(task.challengeStartTime) }}</span>
							</div>
							<div class="my-time-item" v-if="task.challengeEndTime">
								<span class="my-time-icon">✅</span>
								<span class="my-time-label">完成时间：</span>
								<span class="my-time-value">{{ formatDateTime(task.challengeEndTime) }}</span>
							</div>
						</div>
						
						<!-- 任务类型信息（在我发布的任务中，仅在进行中和已完成状态显示，所有任务都有teamId） -->
						<div v-if="myTaskType === 'published' && (task.status === '2' || task.status === '3') && task.teamId" class="challenge-type-info">
							<div class="challenge-type-card challenge-type-team">
								<div class="challenge-type-header">
									<div class="challenge-type-icon">
										<span>👥</span>
									</div>
									<span class="challenge-type-title">{{ getChallengeTypeText(task.teamInfo) }}</span>
									<div class="challenge-type-badge badge-team">
										团队
									</div>
								</div>
							</div>
						</div>
						
						<!-- 挑战类型信息（仅在我挑战的任务中显示，所有任务都有teamId） -->
						<div v-if="myTaskType === 'challenge' && task.teamId" class="challenge-type-info">
							<div class="challenge-type-card challenge-type-team">
								<div class="challenge-type-header">
									<div class="challenge-type-icon">
										<span>👥</span>
									</div>
									<span class="challenge-type-title">{{ getChallengeTypeText(task.teamInfo) }}</span>
									<div class="challenge-type-badge badge-team">
										团队
									</div>
								</div>
								
								<!-- 团队详细信息 -->
								<div v-if="task.teamInfo" class="team-details">
									<div class="team-role-info">
										<span class="role-label">我的角色：</span>
										<span class="role-value" :class="getRoleClass(task.teamRole)">
											<span v-if="task.teamRole === 'leader'">👑 队长</span>
											<span v-else-if="task.teamRole === 'member'">🤝 队员</span>
											<span v-else>❓ 未知</span>
										</span>
									</div>
									<div v-if="task.teamInfo.teamName" class="team-name-info">
										<span class="team-label">团队名称：</span>
										<span class="team-name">{{ task.teamInfo.teamName }}</span>
									</div>
									<div v-if="getMemberCount(task.teamInfo) > 0" class="team-members-info">
										<span class="members-label">团队成员：</span>
										<span class="members-count">{{ getMemberCount(task.teamInfo) }}人</span>
									</div>
								</div>
							</div>
						</div>
						
						<!-- 我的任务铭牌显示 -->
						<div class="my-task-reward-badges" v-if="task.badges && task.badges.length > 0">
							<div class="my-task-badges">
								<p>
									<span 
										v-for="badge in task.badges" 
										:key="badge.id" 
										class="badge"
										:data-level="badge.level"
										:title="`${getBadgeName(badge.association)} 等级 ${badge.level}`"
									>
										{{ getBadgeName(badge.association) }} Lv{{ badge.level }}
									</span>
								</p>
							</div>
						</div>
						
						<div class="task-card-footer">
							<div class="publisher-info-new" @click.stop="goToUserProfile(task.publisherId)">
								<img :src="getAvatarUrl(task.userAvatar)" class="publisher-avatar-new" @error="handleTaskAvatarError" />
								<div class="publisher-meta">
									<span class="publisher-name-new">{{ task.userName || userStore.profile?.nickname }}</span>
									<span class="org-name-new" 
										v-if="task.orgName && task.creditCode" 
										@click.stop="goToOrganization(task.creditCode)">
										{{ task.orgName }}
									</span>
									<span class="org-name-new" v-else>{{ task.orgName || '未知企业' }}</span>
								</div>
							</div>
							<div class="task-meta">
								<span class="task-location">{{ getLocationName(task.adCode) || '未知地区' }}</span>
								<span class="task-distance">{{ task.distance || '未知距离' }}</span>
								<span class="task-status" :class="'status-' + task.status">{{ getStatusText(task.status) }}</span>
							</div>
						</div>
					</div>
				</div>
				<div v-else class="empty-state-new">
					<div class="empty-icon">📭</div>
					<div class="empty-title">暂无任务</div>
					<div class="empty-desc">您还没有相关的任务记录</div>
				</div>
			</div>
		</div>

		<!-- 我要招聘按钮 
		<div class="recruit-btn-wrapper">
			<button class="recruit-btn" @click="goToPublishTask">
				发布任务
			</button>
		</div>
		-->

		<!-- 分页 -->
		<div class="pagination">
			<div class="page-numbers-row">
				<button @click="changePage(currentPage - 1)" :disabled="currentPage === 1">上一页</button>
				<template v-for="pageNum in getPageList" :key="pageNum">
					<button :class="{ active: pageNum === currentPage }" @click="changePage(pageNum)"
						:disabled="pageNum === currentPage">
						{{ pageNum }}
					</button>
				</template>
				<button @click="changePage(currentPage + 1)" :disabled="currentPage === totalPages">下一页</button>
			</div>

		</div>
	</div>
</template>

<script>
import { NETWORK_CONFIG } from '@/config/network.js'
	import {
		ref,
		reactive,
		computed,
		onMounted,
		onUnmounted
	} from "vue";
	import { onShow } from '@dcloudio/uni-app';
	import {
		geoData,
		getAdcodeByDistrict,
		getLocationByAdcode
	} from "@/utils/geoUtils";
	import {
		categories
	} from "@/utils/skillUtils";
	import {
		calculateDistance
	} from "@/utils/geoUtils"; // 引入 geoUtils 中的距离计算方法
	import {
		useUserStore
	} from '@/store/user';
	import SearchButton from '@/components/SearchButton.vue'
	import PublishTaskButton from '@/components/PublishTaskButton.vue'
	import { getAvatarUrl } from '@/utils/imageUtils.js'



	export default {

		components: {
			SearchButton,
			PublishTaskButton
		},
		name: "Home",
		setup() {
			console.log(
			  "%c[geoData 检查]%c geoData =",
			  "background: #4A90E2; color: #fff; font-weight: bold; padding: 2px 6px; border-radius: 4px;",
			  "color: #4A90E2; font-weight: bold;",
			  geoData
			);
			const userStore = useUserStore();
			
			// 安全的用户信息访问
			const safeUserProfile = computed(() => {
				const profile = userStore.profile || {
					avatarUrl: '',
					nickname: '未登录',
					uid: 'guest-user'
				};
				
				// 确保所有必需字段都有值，防止null/undefined错误
				return {
					avatarUrl: profile.avatarUrl || '',
					nickname: profile.nickname || '未登录用户',
					uid: profile.uid || 'guest-user',
					signature: profile.signature || '',
					creditScore: profile.creditScore || 0,
					phone: profile.phone || '',
					email: profile.email || '',
					orgName: profile.orgName || '',
					orgAvatarUrl: profile.orgAvatarUrl || ''
				};
			});
			
			const provinces = ref(geoData.map((province) => province.name));
			const selectedProvince = ref("");
			const cities = ref([]);
			const districts = ref([]);
			const selectedCity = ref("");
			const selectedDistrict = ref("");
			const selectedAdCode = ref("");

			// 任务切换相关
			const currentTab = ref('hall'); // 'hall' 或 'my'
			
			// 未读推送数量
			const unreadPushCount = ref(0);
			
			// 我的任务相关
			const myTasks = ref([]);
			const myTasksLoading = ref(false);
			const myTaskType = ref('published'); // 'published' 或 'challenge'
			const myTaskFilters = reactive({
				status: '',
				type: '',
				keyword: '',
				teamRole: null, // 组队角色筛选：null(全部), '1'(队长), '0'(队员)
				teamMemberCount: null // 团队人数筛选：null(全部), '1'(单人), '2'(双人), '3+'(多人), 'range:1-3'(区间)
			});
			
			// 我的任务筛选相关
			const showMyTaskTimeFilter = ref(false)
			const showMyTaskBadgeFilter = ref(false)
			const showMyTaskSortSelector = ref(false)
			const showMyTaskRegionSelector = ref(false)
			const showMyTaskTypeSelector = ref(false)
			const showTeamMemberCountRangeSelector = ref(false)
			// 自定义人数范围输入
			const customMinMemberCount = ref('')
			const customMaxMemberCount = ref('')
			
			// 我的任务地区筛选
			const tempMyTaskProvince = ref("")
			const tempMyTaskCity = ref("")
			const tempMyTaskDistrict = ref(null)
			const myTaskProvince = ref("")
			const myTaskCity = ref("")
			const myTaskDistrict = ref("")
			const myTaskAdCode = ref("")
			
			// 我的任务类别筛选
			const tempMyTaskField = ref("")
			const tempMyTaskCategory = ref("")
			const tempMyTaskDirection = ref("")
			const myTaskField = ref("")
			const myTaskCategory = ref("")
			const myTaskDirection = ref("")
			
			// 我的任务时间筛选
			const tempMyTaskStartPublishDate = ref("")
			const tempMyTaskEndPublishDate = ref("")
			const tempMyTaskStartDeadlineDate = ref("")
			const tempMyTaskEndDeadlineDate = ref("")
			const tempMyTaskStartAcceptDate = ref("")
			const tempMyTaskEndAcceptDate = ref("")
			const tempMyTaskStartCompleteDate = ref("")
			const tempMyTaskEndCompleteDate = ref("")
			const myTaskStartPublishDate = ref("")
			const myTaskEndPublishDate = ref("")
			const myTaskStartDeadlineDate = ref("")
			const myTaskEndDeadlineDate = ref("")
			const myTaskStartAcceptDate = ref("")
			const myTaskEndAcceptDate = ref("")
			const myTaskStartCompleteDate = ref("")
			const myTaskEndCompleteDate = ref("")
			
			// 我的任务铭牌等级筛选
			const tempMyTaskMinLevel = ref(null)
			const tempMyTaskMaxLevel = ref(null)
			const myTaskMinLevel = ref(null)
			const myTaskMaxLevel = ref(null)
			
			// 我的任务排序
			const myTaskSortBy = ref('')
			const myTaskSortDirection = ref('DESC')

			const fields = ref(categories);
			const selectedField = ref("");
			const selectedCategory = ref("");
			const selectedDirection = ref("");
			const categoryList = ref([]); // 修复：定义 categoryList
			const directions = ref([]);

			// 类型选择弹窗相关
			const showTypeSelector = ref(false)
			const tempField = ref("")
			const tempCategory = ref("")
			const tempDirection = ref("")

			const showRegionSelector = ref(false)
			const tempProvince = ref("")
			const tempCity = ref("")
			const tempDistrict = ref(null)

			// 时间筛选相关
			const showTimeFilter = ref(false)
			const tempStartPublishDate = ref("")
			const tempEndPublishDate = ref("")
			const tempStartDeadlineDate = ref("")
			const tempEndDeadlineDate = ref("")
			const startPublishDate = ref("")
			
			// 排序相关
			const showSortSelector = ref(false)
			const sortBy = ref('') // 排序字段：'publishTime', 'deadline', 'reward', 'level'
			const sortDirection = ref('DESC') // 排序方向：'ASC', 'DESC'
			const endPublishDate = ref("")
			const startDeadlineDate = ref("")
			const endDeadlineDate = ref("")

			// 铭牌等级筛选相关
			const showBadgeFilter = ref(false)
			const tempMinLevel = ref(null)
			const tempMaxLevel = ref(null)
			const minLevel = ref(null)
			const maxLevel = ref(null)

			function openTypeSelector() {
				showTypeSelector.value = true
				// 默认选中全部
				tempField.value = ''
				tempCategory.value = ''
				tempDirection.value = ''
			}

			function selectTempField(code) {
				tempField.value = code
				// 选中一级，下级重置为全部
				tempCategory.value = ''
				tempDirection.value = ''
			}

			function selectTempCategory(code) {
				tempCategory.value = code
				// 选中二级，下级重置为全部
				tempDirection.value = ''
			}

			function selectTempDirection(code) {
				tempDirection.value = code
			}

			function confirmType() {
				selectedField.value = tempField.value;
				selectedCategory.value = tempCategory.value;
				selectedDirection.value = tempDirection.value;
				showTypeSelector.value = false;
				// 直接传递参数，确保用的是最新值
				fetchTasks({
					field: selectedField.value,
					category: selectedCategory.value,
					direction: selectedDirection.value
				})
				uni.showToast({
					title: `选中: ${selectedField.value}/${selectedCategory.value}/${selectedDirection.value}`,
					icon: 'none',
					duration: 2000
				});

			}

			const tasks = ref([]);
			const defaultAvatar = ref("https://example.com/default-avatar.jpg");
			const currentPage = ref(1);
			const pageSize = ref(6);
			const keyword = ref("");

			const totalPages = ref(0);

			console.log('组件初始化时 userStore 状态:', userStore.$state)

			if (!userStore.isLoggedIn) {
				console.warn('用户未登录或数据未恢复，当前状态:', {
					storeState: userStore.$state,
					isLoggedIn: userStore.isLoggedIn,
					userInfo: userStore.getUserInfo
				});
				// 尝试重新恢复用户数据
				userStore.restoreUser();
				// 重新获取用户信息
				const restoredUserInfo = userStore.getUserInfo;
				console.log('恢复后的完整 userStore 状态:', {
					storeState: userStore.$state,
					isLoggedIn: userStore.isLoggedIn,
					userInfo: restoredUserInfo
				});
			}

			const getPageList = computed(() => {
				// 页码按钮逻辑
				if (totalPages.value <= 5) {
					return Array.from({
						length: totalPages.value
					}, (_, i) => i + 1);
				}
				if (currentPage.value <= 3) {
					return [1, 2, 3, 4, 5];
				}
				if (currentPage.value >= totalPages.value - 2) {
					return [totalPages.value - 4, totalPages.value - 3, totalPages.value - 2, totalPages.value - 1,
						totalPages.value
					];
				}
				return [currentPage.value - 2, currentPage.value - 1, currentPage.value, currentPage.value + 1,
					currentPage.value + 2
				];
			});

			// 添加检查用户状态的函数

			// 检查是否有 accessToken
			const checkAuth = () => {
				const token = uni.getStorageSync("accessToken");
				if (!token) {
					console.warn("未找到 accessToken，跳转到登录页");
					uni.showToast({
						title: '请先登录',
						icon: 'none',
						duration: 2000
					});
					//4

					setTimeout(() => {
						uni.redirectTo({
							url: '/pages/auth/login/index'
						});
					}, 1500);

				}
			};

			const currentLocation = ref({
				latitude: 0,
				longitude: 0
			}); // 保存当前位置

			// 获取当前位置
			const fetchCurrentLocation = () => {
				// 预先定义位置相关函数
				// 尝试获取位置的函数
				const tryGetLocation = (type = 'gcj02', retryCount = 0) => {
					uni.getLocation({
						type,
						success: (res) => {
							currentLocation.value.latitude = res.latitude;
							currentLocation.value.longitude = res.longitude;
							console.log(`使用 ${type} 坐标系获取位置成功:`, currentLocation.value);
							fetchTasks(); // 在获取当前位置后调用 fetchTasks
						},
						fail: (error) => {
							console.error(`使用 ${type} 坐标系获取位置失败:`, error);

							// 如果是 gcj02 失败且未重试过，尝试使用 wgs84
							if (type === 'gcj02' && retryCount === 0) {
								console.log('尝试使用 wgs84 坐标系...');
								tryGetLocation('wgs84', 1);
								return;
							}

							// 如果两种坐标系都失败了，使用默认位置
							if (retryCount > 0) {
								console.warn('所有坐标系都获取失败，使用默认位置');
								useDefaultLocation();
							}
						}
					});
				};

				// 使用默认位置的函数
				const useDefaultLocation = () => {
					// 使用默认位置（例如：北京市中心）
					currentLocation.value = {
						latitude: 39.9042,
						longitude: 116.4074
					};
					
					uni.showToast({
						title: '使用默认位置（北京）',
						icon: 'none',
						duration: 2000
					});
					
					fetchTasks();
				};
				
				// 开始执行获取位置逻辑
				// #ifdef MP-WEIXIN
				// 小程序端：先检查位置权限
				uni.getSetting({
					success: (res) => {
						if (res.authSetting['scope.userLocation'] === false) {
							// 用户拒绝了位置权限，引导用户开启
							uni.showModal({
								title: '需要位置权限',
								content: '为了给您推荐附近的任务，需要获取您的位置信息',
								confirmText: '去设置',
								cancelText: '使用默认位置',
								success: (modalRes) => {
									if (modalRes.confirm) {
										uni.openSetting({
											success: (settingRes) => {
												if (settingRes.authSetting['scope.userLocation']) {
													// 用户开启了权限，重新获取位置
													tryGetLocation();
												} else {
													useDefaultLocation();
												}
											}
										});
									} else {
										useDefaultLocation();
									}
								}
							});
						} else {
							// 有权限或未设置过，直接获取位置
							tryGetLocation();
						}
					},
					fail: () => {
						// 获取设置失败，直接尝试获取位置
						tryGetLocation();
					}
				});
				// #endif

				// #ifdef H5
				// H5端直接获取位置
				tryGetLocation();
				// #endif
			};

			// 切换页码
			const changePage = (page) => {
				if (page >= 1 && page <= totalPages.value) {
					currentPage.value = page;
					fetchTasks(); // 重新获取任务数据
				}
			};

			// 修改每页显示的任务数量
			const changePageSize = (size) => {
				pageSize.value = size;
				currentPage.value = 1; // 重置到第一页
				fetchTasks(); // 重新获取任务数据
			};

			const fetchTasks = async (params) => {
				try {
					// 生成技能代码
					let badges = "";
					if (params?.direction) {
						badges = params.direction; // 6位
					} else if (params?.category) {
						badges = params.category; // 4位
					} else if (params?.field) {
						badges = params.field; // 2位
					} else {
						badges = "";
					}
					// 构建时间参数
					const timeParams = {}
					if (startPublishDate.value) {
						timeParams.startPublishTime = startPublishDate.value + 'T00:00:00'
					}
					if (endPublishDate.value) {
						timeParams.endPublishTime = endPublishDate.value + 'T23:59:59'
					}
					if (startDeadlineDate.value) {
						timeParams.startDeadline = startDeadlineDate.value + 'T00:00:00'
					}
					if (endDeadlineDate.value) {
						timeParams.endDeadline = endDeadlineDate.value + 'T23:59:59'
					}

					// 构建等级参数
					const levelParams = {}
					if (minLevel.value) {
						levelParams.minLevel = minLevel.value
					}
					if (maxLevel.value) {
						levelParams.maxLevel = maxLevel.value
					}

					// 构建排序参数
					const sortParams = {}
					if (sortBy.value) {
						sortParams.priority1 = sortBy.value;
						sortParams.direction1 = sortDirection.value || 'DESC';
					}

					const response = await uni.request({
						url: `${NETWORK_CONFIG.API_BASE_URL}/task/search`,
						method: 'GET',
						data: {
							adCode: selectedAdCode.value || "", // 地区代码
							keyword: keyword.value || "", // 搜索关键词
							badges: badges || "", // 领域
							page: (currentPage.value - 1) || 0, // 当前页码
							size: pageSize.value, // 每页显示的任务数
							status: 1,
							...timeParams, // 时间筛选参数
							...levelParams, // 等级筛选参数
							...sortParams, // 排序参数
						}
					});

					console.log('=== API响应完整信息 ===');
					console.log('响应状态码:', response.statusCode);
					console.log('响应头信息:', response.header);
					console.log('响应数据:', response.data);
					console.log('响应数据类型:', typeof response.data);
					console.log('响应数据是否为数组:', Array.isArray(response.data));
					console.log('响应数据键名:', response.data ? Object.keys(response.data) : '无数据');
					console.log('========================');

					// uni.request 的返回数据在 res.data 中
					const data = response.data;
					
					// 详细检查数据结构
					console.log('=== 数据结构分析 ===');
					console.log('data存在:', !!data);
					console.log('data类型:', typeof data);
					if (data) {
						console.log('data的所有属性:', Object.keys(data));
						console.log('data.tasks存在:', !!data.tasks);
						console.log('data.tasks类型:', typeof data.tasks);
						console.log('data.tasks是否为数组:', Array.isArray(data.tasks));
						if (data.tasks) {
							console.log('data.tasks长度:', data.tasks.length);
							console.log('data.tasks前3项:', data.tasks.slice(0, 3));
						}
						console.log('data.totalPages:', data.totalPages);
						console.log('data.currentPage:', data.currentPage);
					}
					console.log('==================');
					
					if (!data || !data.tasks) {
						console.error('数据格式检查失败:', {
							hasData: !!data,
							dataType: typeof data,
							hasTasks: !!(data && data.tasks),
							tasksType: data && data.tasks ? typeof data.tasks : 'undefined',
							fullData: data
						});
						throw new Error('返回数据格式错误');
					}

					totalPages.value = data.totalPages; // 更新总页数
					currentPage.value = data.currentPage; // 更新当前页码

					tasks.value = data.tasks.map((task) => {
						try {
							const parsedTask = typeof task === 'string' ? JSON.parse(task) : task;

							// 调试任务数据中的用户信息
							console.log('=== 任务数据处理调试 ===');
							console.log('任务ID:', parsedTask.taskId);
							console.log('原始publisherId:', parsedTask.publisherId);
							console.log('publisherId类型:', typeof parsedTask.publisherId);
							console.log('publisherName:', parsedTask.publisherName);
							console.log('userAvatar:', parsedTask.userAvatar);
							console.log('=======================');

							if (typeof parsedTask.badges === "string") {
								try {
									parsedTask.badges = JSON.parse(parsedTask.badges.replace(/'/g, '"'));
								} catch {
									parsedTask.badges = [];
								}
							}

							// 计算距离时添加错误处理
							try {
								if (currentLocation.value.latitude && currentLocation.value.longitude &&
									parsedTask.latitude && parsedTask.longitude) {
									parsedTask.distance = calculateDistance(
										currentLocation.value.latitude,
										currentLocation.value.longitude,
										parsedTask.latitude,
										parsedTask.longitude
									);
									console.log("计算的距离:", parsedTask.distance);
								} else {
									parsedTask.distance = "未知距离";
									console.warn("无法计算距离：缺少位置信息", {
										current: currentLocation.value,
										task: {
											latitude: parsedTask.latitude,
											longitude: parsedTask.longitude
										}
									});
								}
							} catch (error) {
								console.error("计算距离时出错:", error);
								parsedTask.distance = "计算失败";
							}

							// 所有任务都是团队任务（基于teamId），无需设置challengeType

							return parsedTask;
						} catch (error) {
							console.error("处理任务数据失败:", error);
							return null;
						}
					}).filter((task) => task !== null);

					console.log("处理后的任务数据:", tasks.value);
				} catch (error) {
					console.log("=== 任务数据获取异常处理 ===");
					console.error("获取任务数据失败:", error);
					console.log("错误类型:", typeof error);
					console.log("错误消息:", error?.message || '无消息');
					console.log("错误堆栈:", error?.stack || '无堆栈');
					console.log("错误名称:", error?.name || '无名称');
					console.log("完整错误对象:", error);
					console.log("===============================");
					
					uni.showToast({
						title: '获取任务列表失败',
						icon: 'none'
					});
					tasks.value = [];
				}
			};
			const updatecategoryList = () => {
				currentPage.value = 1; // 重置到第一页
				const field = fields.value.find((f) => f.code === selectedField.value);
				if (field) {
					categoryList.value = field.subcategories.map((category) => ({
						name: category.name,
						code: category.code,
					}));
				} else {
					categoryList.value = []; // 如果未找到领域，清空大类列表
				}
				// 清空下一级选择
				selectedCategory.value = ""; 
				directions.value = [];
				selectedDirection.value = "";
				fetchTasks(); // 调用 fetchTasks，传递所有筛选条件
			};

			const updateDirections = () => {
				currentPage.value = 1; // 重置到第一页
				const field = fields.value.find((f) => f.code === selectedField.value);
				const category = field?.subcategories.find((c) => c.code === selectedCategory.value);
				if (category) {
					directions.value = category.directions.map((direction) => ({
						name: direction.name,
						code: direction.code,
					}));
				} else {
					directions.value = []; // 如果未找到大类，清空方向列表
				}

				// 清空下一级选择
				selectedDirection.value = "";

				fetchTasks(); // 调用 fetchTasks，传递所有筛选条件
			};

			const handleDirectionChange = () => {
				currentPage.value = 1; // 重置到第一页
				const field = fields.value.find((f) => f.code === selectedField.value);
				const category = field?.subcategories.find((c) => c.code === selectedCategory.value);
				const direction = category?.directions.find((d) => d.code === selectedDirection.value);
				if (direction) {
					fetchTasks("", keyword.value, selectedDirection.value); // 以上一级为准
				}
			};

			const updateCities = () => {
				const province = geoData.find((p) => p.name === selectedProvince.value);
				if (province) {
					cities.value = province.cities.map((city) => city.name);
				} else {
					cities.value = []; // 如果未找到省份，清空城市列表
				}
				// 清空下一级选择
				selectedCity.value = "";
				districts.value = [];
				selectedDistrict.value = "";
				getSelectedAdcode(); // 调用 getSelectedAdcode，以上一级为准
			};

			const updateDistricts = () => {
				const province = geoData.find((p) => p.name === selectedProvince.value);
				const city = province?.cities.find((c) => c.name === selectedCity.value);
				if (city) {
					districts.value = city.districts.map((district) => district.name);
				} else {
					districts.value = []; // 如果未找到城市，清空区县列表
				}
				// 清空下一级选择
				selectedDistrict.value = "";
				getSelectedAdcode(); // 调用 getSelectedAdcode，以上一级为准
			};

			const getSelectedAdcode = () => {
				currentPage.value = 1; // 重置到第一页
				let adCode = "";

				// 优先判断区县
				if (selectedDistrict.value) {
					const province = geoData.find((p) => p.name === selectedProvince.value);
					const city = province?.cities.find((c) => c.name === selectedCity.value);
					const district = city?.districts.find((d) => d.name === selectedDistrict.value);
					if (district) {
						adCode = district.adcode;
					}
				} else if (selectedCity.value) {
					// 如果没有区县，判断城市
					const province = geoData.find((p) => p.name === selectedProvince.value);
					const city = province?.cities.find((c) => c.name === selectedCity.value);
					if (city) {
						adCode = city.adcode;
					}
				} else if (selectedProvince.value) {
					// 如果没有城市，判断省份
					const province = geoData.find((p) => p.name === selectedProvince.value);
					if (province) {
						adCode = province.adcode;
					}
				}

				selectedAdCode.value = adCode; // 保存选中的 adCode
				fetchTasks(); // 调用 fetchTasks，传递所有筛选条件
			};

			const handleSearch = () => {
				fetchTasks("", keyword.value);
			};

			const formatReward = (reward) => {
				if (!isNaN(reward)) {
					return Number(reward).toLocaleString();
				}
				return reward;
			};

			const formatDateTime = (dateTime) => {
				if (!dateTime) return '未设置';
				
				try {
					// 处理iOS不支持的日期格式
					let date;
					if (typeof dateTime === 'string') {
						// 将 "yyyy-MM-dd HH:mm:ss" 格式转换为 "yyyy-MM-ddTHH:mm:ss" 格式
						if (dateTime.includes(' ') && !dateTime.includes('T')) {
							dateTime = dateTime.replace(' ', 'T');
						}
					}
					date = new Date(dateTime);
					if (isNaN(date.getTime())) return '无效时间';
					
					const now = new Date();
					const diff = now.getTime() - date.getTime();
					const days = Math.floor(diff / (1000 * 60 * 60 * 24));
					
					// 如果是未来时间（截止时间），显示剩余天数
					if (diff < 0) {
						const remainingDays = Math.ceil(-diff / (1000 * 60 * 60 * 24));
						if (remainingDays === 1) return '明天截止';
						if (remainingDays <= 7) return `${remainingDays}天后截止`;
						return date.toLocaleDateString('zh-CN', { 
							month: 'short', 
							day: 'numeric',
							hour: '2-digit',
							minute: '2-digit'
						});
					}
					
					// 如果是过去时间（发布时间），显示相对时间
					if (days === 0) {
						const hours = Math.floor(diff / (1000 * 60 * 60));
						if (hours === 0) {
							const minutes = Math.floor(diff / (1000 * 60));
							return minutes <= 0 ? '刚刚发布' : `${minutes}分钟前发布`;
						}
						return `${hours}小时前发布`;
					}
					
					if (days === 1) return '昨天发布';
					if (days <= 7) return `${days}天前发布`;
					
					return date.toLocaleDateString('zh-CN', { 
						month: 'short', 
						day: 'numeric',
						hour: '2-digit',
						minute: '2-digit'
					});
				} catch (error) {
					console.error('时间格式化错误:', error);
					return '时间格式错误';
				}
			};

			const getBadgeName = (association) => {
				const field = fields.value.find((f) =>
					f.subcategories.some((category) =>
						category.directions.some((direction) => direction.code === association)
					)
				);

				if (field) {
					const category = field.subcategories.find((c) =>
						c.directions.some((d) => d.code === association)
					);
					const direction = category.directions.find((d) => d.code === association);

					return direction ? direction.name : "未知方向";
				}

				return "未知方向";
			};

			const getLocationName = (adCode) => {
				if (!adCode) return null;
				const location = getLocationByAdcode(adCode);
				if (location) {
					return `${location.province} ${location.city} ${location.district}`;
				}
				return null;
			};

			const goToPublishTask = () => {
				uni.navigateTo({
					url: '/pages/task/publish/index',
					fail: (err) => {
						console.error('跳转到发布任务页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			};

			const goToRecentPushes = () => {
				uni.navigateTo({
					url: '/pages/push/recent/index',
					fail: (err) => {
						console.error('跳转到近期推送页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			};

			const goToTaskDetail = (taskId) => {
				if (!taskId) {
					console.error('缺少任务ID')
					return
				}
				
				// 确保taskId是字符串且不为null
				const safeTaskId = String(taskId).trim ? String(taskId) : 'default-task';
				
				uni.navigateTo({
					url: `/pages/task/detail/index?id=${safeTaskId}`,
					fail: (err) => {
						console.error('跳转到任务详情页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			};



			const drawerOpen = ref(false);
			const isMobile = ref(false);
			const checkMobile = () => {
				const systemInfo = uni.getSystemInfoSync();
				isMobile.value = systemInfo.windowWidth <= 900;
			};

			// 用户信息展示跳转
			const goToMyProfile = () => {
				console.log('=== 点击自己头像跳转调试信息 ===');
				console.log('当前routeUid:', uni.getStorageSync('routeUid'));
				console.log('清除routeUid，准备查看自己的主页');
				console.log('========================');
				
				// 清除routeUid，确保查看自己的主页
				uni.removeStorageSync('routeUid');
				
				uni.switchTab({
					url: '/pages/profile/index',
					success: (res) => {
						console.log('跳转到自己主页成功:', res);
					},
					fail: (err) => {
						console.error('跳转到个人主页失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			};

			const goToUserProfile = (publisherId) => {
				console.log('=== 用户头像点击调试信息 ===');
				console.log('原始publisherId:', publisherId);
				console.log('publisherId类型:', typeof publisherId);
				console.log('publisherId是否为空:', !publisherId);
				console.log('publisherId是否为空字符串:', publisherId === '');
				console.log('publisherId是否为null:', publisherId === null);
				console.log('publisherId是否为undefined:', publisherId === undefined);
				
				if (!publisherId) {
					console.error('缺少发布者ID，无法跳转');
					uni.showToast({
						title: '缺少用户ID',
						icon: 'none'
					});
					return;
				}
				
				// 确保publisherId是字符串且不为null/undefined
				const safePublisherId = String(publisherId).trim ? String(publisherId) : 'default-user';
				
				console.log('处理后的publisherId:', safePublisherId);
				console.log('当前用户ID:', userStore.profile?.uid);
				console.log('是否为查看自己:', safePublisherId === userStore.profile?.uid);
				
				// 将目标用户ID存储到routeUid中，供profile页面使用
				if (safePublisherId !== userStore.profile?.uid) {
					console.log('存储routeUid:', safePublisherId);
					uni.setStorageSync('routeUid', safePublisherId);
					// 设置查看其他用户标记
					uni.setStorageSync('viewOtherUser', 'true');
					console.log('设置viewOtherUser标记为true');
				} else {
					console.log('查看自己，清除routeUid和viewOtherUser');
					uni.removeStorageSync('routeUid');
					uni.removeStorageSync('viewOtherUser');
				}
				
				console.log('准备跳转到用户主页...');
				
				// 使用switchTab跳转到profile页面（因为它在tabBar中）
				uni.switchTab({
					url: '/pages/profile/index',
					success: (res) => {
						console.log('跳转到用户主页成功:', res);
						console.log('跳转成功，查看用户ID:', safePublisherId);
					},
					fail: (err) => {
						console.error('=== 跳转失败详细信息 ===');
						console.error('跳转到用户主页失败:', err);
						console.error('错误对象:', JSON.stringify(err, null, 2));
						console.error('错误类型:', typeof err);
						console.error('错误消息:', err.errMsg || err.message || '无错误消息');
						console.error('错误代码:', err.errCode || err.code || '无错误代码');
						console.error('publisherId:', safePublisherId);
						console.error('========================');
						
						uni.showToast({
							title: `页面跳转失败: ${err.errMsg || '未知错误'}`,
							icon: 'none',
							duration: 3000
						});
					}
				});
			};

			// 跳转到企业页面
			const goToOrganization = (creditCode) => {
				if (creditCode) {
					uni.navigateTo({
						url: `/pages/organization/index?id=${encodeURIComponent(creditCode)}`,
						fail: (err) => {
							console.error('跳转到企业页面失败:', err);
							uni.showToast({
								title: '页面跳转失败',
								icon: 'none'
							});
						}
					});
				} else {
					uni.showToast({
						title: '该企业信息不完整',
						icon: 'none'
					});
				}
			};

			// 处理头像加载错误
			const handleAvatarError = () => {
				console.log('用户头像加载失败，使用默认头像');
			};

			// 处理任务头像加载错误
			const handleTaskAvatarError = () => {
				console.log('任务发布者头像加载失败，使用默认头像');
			};

			// 导航方法
			const goToNewPeople = () => {
				console.log('尝试跳转到新人福利页面')
				uni.navigateTo({
					url: '/pages/newpeople/index',
					success: () => {
						console.log('跳转到新人福利页面成功')
					},
					fail: (err) => {
						console.error('跳转到新人福利页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			}

		const goToSponsorship = () => {
			uni.navigateTo({
				url: '/pages/business/sponsorship/index',
				fail: (err) => {
					console.error('跳转到赞助排行榜页面失败:', err)
					uni.showToast({
						title: '页面跳转失败',
						icon: 'none'
					})
				}
			})
		}

		const goToApex = () => {
				uni.navigateTo({
					url: '/pages/apex/index',
					fail: (err) => {
						console.error('跳转到巅峰人才榜页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			}

			const goToMyTask = () => {
				uni.switchTab({
					url: '/pages/my-task/index',
					fail: (err) => {
						console.error('跳转到我的任务页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			}
            const goCompany = () => {
                uni.navigateTo({
                    url: '/pages/company/index',
                })
            }
			const goToMessage = () => {
				uni.switchTab({
					url: '/pages/message/index',
					fail: (err) => {
						console.error('跳转到消息中心页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			}

			const goToEducation = () => {
				uni.navigateTo({
					url: '/pages/education/index',
					fail: (err) => {
						console.error('跳转到智索真源圈子页面失败:', err)
						uni.showToast({
							title: '页面跳转失败',
							icon: 'none'
						})
					}
				})
			}

			const showRegionPopup = ref(false);
			const showDirectionPopup = ref(false);
			const getDirectionLabel = computed(() => {
				if (selectedDirection.value) {
					const direction = directions.value.find(d => d.code === selectedDirection.value);
					return direction ? direction.name : "选择方向";
				}
				return "选择方向";
			});

			const selectProvince = (province) => {
				selectedProvince.value = province;
				updateCities();
				showRegionPopup.value = false;
			};

			const selectCity = (city) => {
				selectedCity.value = city;
				updateDistricts();
				showRegionPopup.value = false;
			};

			const selectDistrict = (district) => {
				selectedDistrict.value = district;
				showRegionPopup.value = false;
			};

			const selectField = (code) => {
				selectedField.value = code;
				updatecategoryList();
				showDirectionPopup.value = false;
			};

			const selectCategory = (code) => {
				selectedCategory.value = code;
				updateDirections();
				showDirectionPopup.value = false;
			};

			const selectDirection = (code) => {
				selectedDirection.value = code;
				handleDirectionChange();
				showDirectionPopup.value = false;
			};

			onMounted(async () => {
				try {
					console.log('首页开始初始化...');
					
					// 先初始化UI相关设置，不依赖网络请求
					checkMobile();
					
					// 监听窗口大小变化
					uni.onWindowResize(() => {
						checkMobile();
					});
					
					// 检查是否有token，没有就跳转到登录页
					const token = uni.getStorageSync("accessToken");
					if (!token) {
						console.log('未检测到token，执行认证检查');
						checkAuth(); // 这个函数会在没有token时跳转到登录页
						return; // 如果需要跳转，就不继续执行了
					}
					
					// 确保userStore的token与storage同步
					if (!userStore.token) {
						userStore.setToken(token);
					}
					
					// 确保有用户信息
					if (!userStore.profile) {
						console.log('有token但无用户信息，尝试获取用户信息');
						try {
							await userStore.fetchUserProfile();
							console.log('获取用户信息成功:', userStore.profile);
						} catch (error) {
							console.error('获取用户信息失败，使用默认值:', error);
							// 设置默认用户资料，确保UI可以正常显示
							userStore.setUser({
								uid: 'default-user',
								nickname: '默认用户',
								avatarUrl: ''
							});
						}
					}
					
					console.log('用户初始化完成，当前用户数据:', userStore);
					
					// 初始化地理位置和任务数据
					updateCities();
					
					// 先获取一次任务列表，不依赖位置
					console.log('获取初始任务列表...');
					await fetchTasks();
					
					// 然后异步获取位置信息
					console.log('开始获取位置信息...');
					setTimeout(() => {
						try {
							fetchCurrentLocation();
						} catch (locError) {
							console.error('获取位置信息失败:', locError);
							// 位置获取失败时使用默认位置
							currentLocation.value = {
								latitude: 39.9042,
								longitude: 116.4074
							};
							fetchTasks();
						}
					}, 500);
					
				} catch (error) {
					console.error('初始化首页失败:', error);
					uni.showToast({
						title: '初始化失败，请重试',
						icon: 'none',
						duration: 2000
					});
					
					// 确保即使出错也显示一些数据
					fetchTasks();
				}
			});

			// 页面显示时刷新数据
			// 获取未读推送数量
			const fetchUnreadPushCount = async () => {
				try {
					const token = uni.getStorageSync('accessToken');
					if (!token) return;
					
					const res = await uni.request({
						url: `${NETWORK_CONFIG.API_BASE_URL}/api/push/unread-count`,
						method: 'GET',
						header: { 'Access-Token': `Bearer ${token}` }
					});
					
					if (res.data && res.data.success) {
						unreadPushCount.value = res.data.unreadCount || 0;
						console.log('未读推送数量:', unreadPushCount.value);
					}
				} catch (e) {
					console.error('获取未读推送数量失败:', e);
				}
			};
			
			onShow(() => {
				console.log('🔄 首页 onShow - 刷新数据');
				
				// 监听任务相关更新事件
				uni.$on('task-related-update', (data) => {
					console.log('🔄 首页收到任务相关更新事件:', data);
					// 刷新任务列表
					fetchTasks();
				});
				
				// 监听推送已读事件
				uni.$on('push-record-read', () => {
					console.log('🔄 首页收到推送已读事件');
					// 刷新未读推送数量
					fetchUnreadPushCount();
				});
				
				// 每次进入页面都刷新任务列表
				fetchTasks();
				
				// 获取未读推送数量
				fetchUnreadPushCount();
			});

			onUnmounted(() => {
				// 移除窗口大小变化监听
				uni.offWindowResize();
				// 移除事件监听
				uni.$off('task-related-update');
				uni.$off('push-record-read');
			});

			function openRegionSelector() {
				showRegionSelector.value = true
				// 默认选中全部
				tempProvince.value = ''
				tempCity.value = ''
				tempDistrict.value = null
			}

			function selectTempProvince(province) {
				tempProvince.value = province
				// 选中一级，下级重置为全部
				tempCity.value = ''
				tempDistrict.value = null
				// 不再自动选第一个城市
			}

			function selectTempCity(city) {
				tempCity.value = city
				// 选中二级，下级重置为全部
				tempDistrict.value = null
				// 不再自动选第一个区
			}

			function selectTempDistrict(district) {
				tempDistrict.value = district
			}

			function confirmRegion() {
				selectedProvince.value = tempProvince.value
				selectedCity.value = tempCity.value
				selectedDistrict.value = tempDistrict.value ? tempDistrict.value.name : ""
				// adCode 取值严格按 geoUtils 结构
				if (tempDistrict.value && tempDistrict.value.adcode) {
					selectedAdCode.value = tempDistrict.value.adcode; // 区级
				} else if (tempCity.value) {
					const provinceObj = geoData.find(p => p.name === tempProvince.value);
					const cityObj = provinceObj?.cities.find(c => c.name === tempCity.value);
					selectedAdCode.value = cityObj?.adcode || ""; // 市级
				} else if (tempProvince.value) {
					const provinceObj = geoData.find(p => p.name === tempProvince.value);
					selectedAdCode.value = provinceObj?.adcode || ""; // 省级
				} else {
					selectedAdCode.value = "";
				}
				showRegionSelector.value = false
				// debug: 打印地区选择
				console.log('[DEBUG] 用户选择的地区:', {
					province: selectedProvince.value,
					city: selectedCity.value,
					district: selectedDistrict.value,
					adCode: selectedAdCode.value
				})
				uni.showToast({
					title: `adCode: ${selectedAdCode.value}`,
					icon: 'none',
					duration: 2000
				});
				fetchTasks()
			}

			// 时间筛选相关方法
			function openTimeFilter() {
				showTimeFilter.value = true
				// 初始化临时值
				tempStartPublishDate.value = startPublishDate.value
				tempEndPublishDate.value = endPublishDate.value
				tempStartDeadlineDate.value = startDeadlineDate.value
				tempEndDeadlineDate.value = endDeadlineDate.value
			}

			function onStartPublishDateChange(e) {
				tempStartPublishDate.value = e.detail.value
			}

			function onEndPublishDateChange(e) {
				tempEndPublishDate.value = e.detail.value
			}

			function onStartDeadlineDateChange(e) {
				tempStartDeadlineDate.value = e.detail.value
			}

			function onEndDeadlineDateChange(e) {
				tempEndDeadlineDate.value = e.detail.value
			}

			function confirmTimeFilter() {
				startPublishDate.value = tempStartPublishDate.value
				endPublishDate.value = tempEndPublishDate.value
				startDeadlineDate.value = tempStartDeadlineDate.value
				endDeadlineDate.value = tempEndDeadlineDate.value
				showTimeFilter.value = false
				fetchTasks()
			}

			function clearTimeFilter() {
				tempStartPublishDate.value = ""
				tempEndPublishDate.value = ""
				tempStartDeadlineDate.value = ""
				tempEndDeadlineDate.value = ""
				startPublishDate.value = ""
				endPublishDate.value = ""
				startDeadlineDate.value = ""
				endDeadlineDate.value = ""
			}

			function getTimeFilterText() {
				const publishText = startPublishDate.value || endPublishDate.value ? 
					`发布: ${startPublishDate.value || '不限'} ~ ${endPublishDate.value || '不限'}` : ''
				const deadlineText = startDeadlineDate.value || endDeadlineDate.value ? 
					`截止: ${startDeadlineDate.value || '不限'} ~ ${endDeadlineDate.value || '不限'}` : ''
				
				if (publishText && deadlineText) {
					return `${publishText} | ${deadlineText}`
				} else if (publishText) {
					return publishText
				} else if (deadlineText) {
					return deadlineText
				} else {
					return '选择时间范围'
				}
			}

			// 铭牌等级筛选相关方法
			function openBadgeFilter() {
				showBadgeFilter.value = true
				// 初始化临时值
				tempMinLevel.value = minLevel.value
				tempMaxLevel.value = maxLevel.value
			}

			function confirmBadgeFilter() {
				minLevel.value = tempMinLevel.value
				maxLevel.value = tempMaxLevel.value
				showBadgeFilter.value = false
				fetchTasks()
			}

			function clearBadgeFilter() {
				tempMinLevel.value = null
				tempMaxLevel.value = null
				minLevel.value = null
				maxLevel.value = null
			}

			function getBadgeFilterText() {
				if (minLevel.value && maxLevel.value) {
					return `等级 ${minLevel.value} ~ ${maxLevel.value}`
				} else if (minLevel.value) {
					return `等级 ≥ ${minLevel.value}`
				} else if (maxLevel.value) {
					return `等级 ≤ ${maxLevel.value}`
				} else {
					return '选择等级范围'
				}
			}

			// 排序筛选相关方法
			function openSortFilter() {
				showSortSelector.value = true
			}

			function setSortBy(field) {
				sortBy.value = field
				if (!field) {
					sortDirection.value = 'DESC' // 重置为默认方向
				}
			}

			function setSortDirection(direction) {
				sortDirection.value = direction
			}

			function confirmSortFilter() {
				showSortSelector.value = false
				currentPage.value = 1 // 重置到第一页
				fetchTasks() // 重新获取任务数据
			}

			function clearSortFilter() {
				sortBy.value = ''
				sortDirection.value = 'DESC'
			}

			function getSortFilterText() {
				if (!sortBy.value) {
					return '默认排序'
				}
				const fieldNames = {
					'publishTime': '发布时间',
					'deadline': '截止时间',
					'reward': '奖励金额',
					'level': '技能等级'
				}
				const directionNames = {
					'DESC': '降序',
					'ASC': '升序'
				}
				return `${fieldNames[sortBy.value]} ${directionNames[sortDirection.value]}`
			}

			// 单独清除时间筛选的方法
			function clearStartPublishDate() {
				tempStartPublishDate.value = ""
			}

			function clearEndPublishDate() {
				tempEndPublishDate.value = ""
			}

			function clearStartDeadlineDate() {
				tempStartDeadlineDate.value = ""
			}

			function clearEndDeadlineDate() {
				tempEndDeadlineDate.value = ""
			}

			function clearPublishTimeFilter() {
				tempStartPublishDate.value = ""
				tempEndPublishDate.value = ""
			}

			function clearDeadlineTimeFilter() {
				tempStartDeadlineDate.value = ""
				tempEndDeadlineDate.value = ""
			}

			// 单独清除等级筛选的方法
			function clearMinLevel() {
				tempMinLevel.value = null
			}

			function clearMaxLevel() {
				tempMaxLevel.value = null
			}

			function clearBadgeLevelFilter() {
				tempMinLevel.value = null
				tempMaxLevel.value = null
			}

			// 任务切换方法
			function switchTab(tab) {
				currentTab.value = tab;
				if (tab === 'my') {
					fetchMyTasks();
				}
			}

			// 我的任务相关方法
			function switchMyTaskType(type) {
				myTaskType.value = type;
				fetchMyTasks();
			}

			function setMyTaskStatus(status) {
				myTaskFilters.status = status;
				
				fetchMyTasks();
			}
			
			// 设置组队角色筛选
			function setTeamRole(role) {
				// 将前端角色转换为后端数字格式
				let roleValue = null; // 默认为null，表示无角色筛选
				if (role === 'leader') {
					roleValue = '1'; // 队长
				} else if (role === 'member') {
					roleValue = '0'; // 队员
				}
				// 当role为空字符串时，设置为null
				if (role === '') {
					roleValue = null;
				}
				myTaskFilters.teamRole = roleValue;
				fetchMyTasks();
			}
			
			// 设置团队人数筛选
			function setTeamMemberCount(count) {
				if (count === '') {
					myTaskFilters.teamMemberCount = null;
					customMinMemberCount.value = '';
					customMaxMemberCount.value = '';
				} else {
					myTaskFilters.teamMemberCount = count;
					// 如果是自定义区间选择，初始化输入框
					if (count && count.startsWith('range:custom:')) {
						const rangeStr = count.replace('range:custom:', '');
						const dashIndex = rangeStr.indexOf('-');
						
						if (dashIndex === -1) {
							// 只有最低人数
							customMinMemberCount.value = rangeStr;
							customMaxMemberCount.value = '';
						} else if (dashIndex === 0) {
							// 只有最高人数
							customMinMemberCount.value = '';
							customMaxMemberCount.value = rangeStr.substring(1);
						} else {
							// 两者都有
							customMinMemberCount.value = rangeStr.substring(0, dashIndex);
							customMaxMemberCount.value = rangeStr.substring(dashIndex + 1);
						}
					} else {
						customMinMemberCount.value = '';
						customMaxMemberCount.value = '';
					}
				}
				// 如果选择了区间，关闭区间选择器
				if (count && count.startsWith('range:')) {
					showTeamMemberCountRangeSelector.value = false;
				}
				fetchMyTasks();
			}
			
			// 打开区间选择器（恢复之前的输入值）
			function openTeamMemberCountRangeSelector() {
				// 如果之前有自定义范围，恢复输入框的值
				if (myTaskFilters.teamMemberCount && myTaskFilters.teamMemberCount.startsWith('range:custom:')) {
					const rangeStr = myTaskFilters.teamMemberCount.replace('range:custom:', '');
					const dashIndex = rangeStr.indexOf('-');
					
					if (dashIndex === -1) {
						// 只有最低人数
						customMinMemberCount.value = rangeStr;
						customMaxMemberCount.value = '';
					} else if (dashIndex === 0) {
						// 只有最高人数
						customMinMemberCount.value = '';
						customMaxMemberCount.value = rangeStr.substring(1);
					} else {
						// 两者都有
						customMinMemberCount.value = rangeStr.substring(0, dashIndex);
						customMaxMemberCount.value = rangeStr.substring(dashIndex + 1);
					}
				} else {
					// 清空输入框
					customMinMemberCount.value = '';
					customMaxMemberCount.value = '';
				}
				showTeamMemberCountRangeSelector.value = !showTeamMemberCountRangeSelector.value;
			}
			
			// 验证自定义范围输入
			function validateCustomRange() {
				// 由于使用了 v-model.number，值可能是数字或空字符串
				const minValue = customMinMemberCount.value;
				const maxValue = customMaxMemberCount.value;
				
				// 转换为数字（如果是字符串则转换为数字，如果是数字则直接使用）
				const min = minValue ? Number(minValue) : null;
				const max = maxValue ? Number(maxValue) : null;
				
				// 如果两者都填，确保最小值不大于最大值
				if (min !== null && max !== null && !isNaN(min) && !isNaN(max) && min > max) {
					uni.showToast({
						title: '最低人数不能大于最高人数',
						icon: 'none'
					});
					return false;
				}
				
				// 确保都是正整数
				if (minValue !== null && minValue !== '' && minValue !== undefined) {
					if (isNaN(min) || min < 1 || !Number.isInteger(min)) {
						uni.showToast({
							title: '请输入有效的正整数',
							icon: 'none'
						});
						return false;
					}
				}
				
				if (maxValue !== null && maxValue !== '' && maxValue !== undefined) {
					if (isNaN(max) || max < 1 || !Number.isInteger(max)) {
						uni.showToast({
							title: '请输入有效的正整数',
							icon: 'none'
						});
						return false;
					}
				}
				
				return true;
			}
			
			// 确认自定义范围
			function confirmCustomRange() {
				if (!validateCustomRange()) {
					return;
				}
				
				// 由于使用了 v-model.number，值是数字或空字符串
				// 转换为字符串处理，空字符串或0或null都视为空
				const min = customMinMemberCount.value ? String(customMinMemberCount.value).trim() : '';
				const max = customMaxMemberCount.value ? String(customMaxMemberCount.value).trim() : '';
				
				// 如果两者都为空，清空筛选
				if (!min && !max) {
					myTaskFilters.teamMemberCount = null;
					showTeamMemberCountRangeSelector.value = false;
					fetchMyTasks();
					return;
				}
				
				// 构建范围字符串：
				// 格式：range:custom:min-max（两者都有）
				//       range:custom:min（只有最低）
				//       range:custom:-max（只有最高）
				let rangeValue = 'range:custom:';
				if (min && max) {
					// 两者都填
					rangeValue += min + '-' + max;
				} else if (min) {
					// 只填最低人数
					rangeValue += min;
				} else if (max) {
					// 只填最高人数
					rangeValue += '-' + max;
				}
				
				myTaskFilters.teamMemberCount = rangeValue;
				showTeamMemberCountRangeSelector.value = false;
				fetchMyTasks();
			}
			
			// 取消自定义范围
			function cancelCustomRange() {
				showTeamMemberCountRangeSelector.value = false;
				// 如果之前有自定义范围，保留它；否则清空输入
				if (!myTaskFilters.teamMemberCount || !myTaskFilters.teamMemberCount.startsWith('range:custom:')) {
					customMinMemberCount.value = '';
					customMaxMemberCount.value = '';
				}
			}
			
			// 清除自定义范围
			function clearCustomRange() {
				customMinMemberCount.value = '';
				customMaxMemberCount.value = '';
			}
			
			// 获取区间显示文本
			function getRangeDisplayText(rangeValue) {
				if (!rangeValue || !rangeValue.startsWith('range:')) return '';
				
				if (rangeValue.startsWith('range:custom:')) {
					const rangeStr = rangeValue.replace('range:custom:', '');
					const dashIndex = rangeStr.indexOf('-');
					
					if (dashIndex === -1) {
						// 只有最低人数（格式：range:custom:min）
						return rangeStr + '人及以上';
					} else if (dashIndex === 0) {
						// 只有最高人数（格式：range:custom:-max）
						const max = rangeStr.substring(1);
						return '1-' + max + '人';
					} else {
						// 两者都填（格式：range:custom:min-max）
						const min = rangeStr.substring(0, dashIndex);
						const max = rangeStr.substring(dashIndex + 1);
						if (min === max) {
							return min + '人';
						}
						return min + '-' + max + '人';
					}
				}
				
				const range = rangeValue.replace('range:', '');
				if (range === '10+') return '10人以上';
				return range + '人';
			}

			function fetchMyTasks() {
				myTasksLoading.value = true;
				console.log('开始获取我的任务，类型:', myTaskType.value, '状态:', myTaskFilters.status);
				
				const token = uni.getStorageSync('accessToken');
				if (!token) {
					console.error('未登录，无法获取我的任务');
					myTasksLoading.value = false;
					return;
				}

				// 根据任务类型选择不同的API端点（参考my-task页面）
				const apiUrl = myTaskType.value === 'published' 
					? `${NETWORK_CONFIG.API_BASE_URL}/task/mypublish`
					: `${NETWORK_CONFIG.API_BASE_URL}/task/mychallenge`;

				// 构建请求参数（参考my-task页面的参数结构）
				const params = {
					keyword: myTaskFilters.keyword || '',
					status: myTaskFilters.status || '',
					page: 0,
					size: 20
				};
				
				// 添加团队角色筛选参数（仅在我挑战的任务中）
				if (myTaskType.value === 'challenge' && myTaskFilters.teamRole) {
						params.teamRole = myTaskFilters.teamRole;
					}
				
				// 添加团队人数筛选参数
				if (myTaskFilters.teamMemberCount) {
					const memberCount = myTaskFilters.teamMemberCount;
					if (memberCount === '1') {
						params.minMemberCount = 1;
						params.maxMemberCount = 1;
					} else if (memberCount === '2') {
						params.minMemberCount = 2;
						params.maxMemberCount = 2;
					} else if (memberCount === '3+') {
						params.minMemberCount = 3;
					} else if (memberCount && memberCount.startsWith('range:custom:')) {
						// 处理自定义范围
						// 格式：range:custom:min-max 或 range:custom:min（只有最低）或 range:custom:-max（只有最高）
						const rangeStr = memberCount.replace('range:custom:', '');
						const dashIndex = rangeStr.indexOf('-');
						
						if (dashIndex === -1) {
							// 没有横线，说明只有最低人数（格式：range:custom:min）
							const min = parseInt(rangeStr);
							if (!isNaN(min) && min > 0) {
								params.minMemberCount = min;
							}
						} else if (dashIndex === 0) {
							// 横线在开头，说明只有最高人数（格式：range:custom:-max）
							const max = parseInt(rangeStr.substring(1));
							if (!isNaN(max) && max > 0) {
								params.minMemberCount = 1; // 默认最低为1
								params.maxMemberCount = max;
							}
						} else {
							// 有横线且不在开头，说明两者都有（格式：range:custom:min-max）
							const min = parseInt(rangeStr.substring(0, dashIndex));
							const max = parseInt(rangeStr.substring(dashIndex + 1));
							
							if (!isNaN(min) && min > 0) {
								params.minMemberCount = min;
							}
							if (!isNaN(max) && max > 0) {
								params.maxMemberCount = max;
							}
						}
					}
				}
				
				// 添加地区筛选参数
				if (myTaskAdCode.value) {
					params.adCode = myTaskAdCode.value;
				}
				
				// 添加类别筛选参数
				let badges = "";
				if (myTaskDirection.value) {
					badges = myTaskDirection.value; // 6位
				} else if (myTaskCategory.value) {
					badges = myTaskCategory.value; // 4位
				} else if (myTaskField.value) {
					badges = myTaskField.value; // 2位
				}
				if (badges) {
					params.badges = badges;
				}
				
				// 添加时间筛选参数
				if (myTaskStartPublishDate.value) {
					params.startPublishTime = myTaskStartPublishDate.value + 'T00:00:00'
				}
				if (myTaskEndPublishDate.value) {
					params.endPublishTime = myTaskEndPublishDate.value + 'T23:59:59'
				}
				if (myTaskStartDeadlineDate.value) {
					params.startDeadline = myTaskStartDeadlineDate.value + 'T00:00:00'
				}
				if (myTaskEndDeadlineDate.value) {
					params.endDeadline = myTaskEndDeadlineDate.value + 'T23:59:59'
				}
				if (myTaskStartAcceptDate.value) {
					params.startAcceptTime = myTaskStartAcceptDate.value + 'T00:00:00'
				}
				if (myTaskEndAcceptDate.value) {
					params.endAcceptTime = myTaskEndAcceptDate.value + 'T23:59:59'
				}
				if (myTaskStartCompleteDate.value) {
					params.startCompleteTime = myTaskStartCompleteDate.value + 'T00:00:00'
				}
				if (myTaskEndCompleteDate.value) {
					params.endCompleteTime = myTaskEndCompleteDate.value + 'T23:59:59'
				}
				
				// 添加铭牌等级筛选参数
				if (myTaskMinLevel.value) {
					params.minLevel = myTaskMinLevel.value
				}
				if (myTaskMaxLevel.value) {
					params.maxLevel = myTaskMaxLevel.value
				}
				
				// 添加排序参数
				if (myTaskSortBy.value) {
					params.priority1 = myTaskSortBy.value;
					params.direction1 = myTaskSortDirection.value || 'DESC';
				}

				// 根据任务类型添加不同的用户ID参数
				if (myTaskType.value === 'published') {
					params.publisherId = userStore.profile?.uid;
				} else if (myTaskType.value === 'challenge') {
					params.challengerId = userStore.profile?.uid;
				}

				console.log('我的任务API请求参数:', params);

				uni.request({
					url: apiUrl,
					method: 'GET',
					header: {
						'Access-Token': `Bearer ${token}`
					},
					data: params,
					success: (response) => {
						console.log('我的任务API响应:', response);
						
						// 处理响应数据（参考my-task页面的数据处理逻辑）
						if (response.statusCode === 200) {
							const res = response.data;
							console.log('响应数据结构检查:', {
								hasRes: !!res,
								hasData: !!(res && res.data),
								hasTasks: !!(res && res.data && res.data.tasks),
								hasDirectTasks: !!(res && res.tasks),
								tasksLength: res?.data?.tasks?.length || res?.tasks?.length,
								tasksType: typeof (res?.data?.tasks || res?.tasks),
								isArray: Array.isArray(res?.data?.tasks || res?.tasks)
							});

							// 检查两种可能的数据结构：res.data.tasks 或 res.tasks
							const tasksData = (res && res.data && res.data.tasks) || (res && res.tasks);
							
							if (tasksData && Array.isArray(tasksData)) {
								myTasks.value = tasksData.map(task => {
									// 字段兼容处理
									const processedTask = typeof task === 'string' ? JSON.parse(task) : task;
									
									// 调试信息：输出原始任务数据
									processedTask.userAvatar = processedTask.userAvatar || processedTask.publisherAvatar || processedTask.challengerAvatar || '';
									processedTask.userName = processedTask.userName || processedTask.publisherName || processedTask.challengerName || '';
									processedTask.orgName = processedTask.orgName || processedTask.organizationName || '';
									
									// 判断用户在团队中的角色（所有任务都有teamId，基于teamInfo判断角色）
									if (processedTask.teamInfo) {
											const currentUserId = userStore.profile?.uid;
											
										// 判断是否是队长
										if (currentUserId && processedTask.teamInfo.leaderId && 
										    String(currentUserId) === String(processedTask.teamInfo.leaderId)) {
												processedTask.teamRole = 'leader';
											} else if (processedTask.teamInfo.members && Array.isArray(processedTask.teamInfo.members)) {
												// 检查是否是团队成员
												const isMember = processedTask.teamInfo.members.some(member => 
													String(member.userId) === String(currentUserId)
												);
											processedTask.teamRole = isMember ? 'member' : 'unknown';
												} else {
													processedTask.teamRole = 'unknown';
												}
											} else {
												processedTask.teamRole = 'unknown';
									}
									
									// 计算距离（如果有位置信息）
									if (currentLocation.value.latitude && currentLocation.value.longitude && processedTask.latitude && processedTask.longitude) {
										processedTask.distance = calculateDistance(
											currentLocation.value.latitude,
											currentLocation.value.longitude,
											processedTask.latitude,
											processedTask.longitude
										);
									} else {
										processedTask.distance = "未知距离";
									}
									
									return processedTask;
								});
								console.log('处理后的我的任务列表:', myTasks.value.length, '条');
							} else {
								console.log('没有找到任务数据，响应结构:', res);
								myTasks.value = [];
							}
						} else {
							console.error('请求失败:', response.statusCode, response.data);
							myTasks.value = [];
						}
					},
					fail: (error) => {
						console.error('获取我的任务请求失败:', error);
						myTasks.value = [];
						uni.showToast({
							title: '获取任务失败',
							icon: 'none'
						});
					},
					complete: () => {
						myTasksLoading.value = false;
					}
				});
			}

			function getStatusText(status) {
				const statusMap = {
					'0': '待审核',
					'1': '已发布',
					'2': '进行中',
					'3': '已完成'
				};
				return statusMap[status] || '未知状态';
			}
			
			// 我的任务筛选方法
			function openMyTaskTimeFilter() {
				showMyTaskTimeFilter.value = true
				// 初始化临时值
				tempMyTaskStartPublishDate.value = myTaskStartPublishDate.value
				tempMyTaskEndPublishDate.value = myTaskEndPublishDate.value
				tempMyTaskStartDeadlineDate.value = myTaskStartDeadlineDate.value
				tempMyTaskEndDeadlineDate.value = myTaskEndDeadlineDate.value
				tempMyTaskStartAcceptDate.value = myTaskStartAcceptDate.value
				tempMyTaskEndAcceptDate.value = myTaskEndAcceptDate.value
				tempMyTaskStartCompleteDate.value = myTaskStartCompleteDate.value
				tempMyTaskEndCompleteDate.value = myTaskEndCompleteDate.value
			}
			
			function openMyTaskBadgeFilter() {
				showMyTaskBadgeFilter.value = true
				// 初始化临时值
				tempMyTaskMinLevel.value = myTaskMinLevel.value
				tempMyTaskMaxLevel.value = myTaskMaxLevel.value
			}
			
			function openMyTaskSortFilter() {
				showMyTaskSortSelector.value = true
			}
			
			// 我的任务时间筛选事件处理
			function onMyTaskStartPublishDateChange(e) {
				tempMyTaskStartPublishDate.value = e.detail.value
			}
			
			function onMyTaskEndPublishDateChange(e) {
				tempMyTaskEndPublishDate.value = e.detail.value
			}
			
			function onMyTaskStartDeadlineDateChange(e) {
				tempMyTaskStartDeadlineDate.value = e.detail.value
			}
			
			function onMyTaskEndDeadlineDateChange(e) {
				tempMyTaskEndDeadlineDate.value = e.detail.value
			}
			
			function onMyTaskStartAcceptDateChange(e) {
				tempMyTaskStartAcceptDate.value = e.detail.value
			}
			
			function onMyTaskEndAcceptDateChange(e) {
				tempMyTaskEndAcceptDate.value = e.detail.value
			}
			
			function onMyTaskStartCompleteDateChange(e) {
				tempMyTaskStartCompleteDate.value = e.detail.value
			}
			
			function onMyTaskEndCompleteDateChange(e) {
				tempMyTaskEndCompleteDate.value = e.detail.value
			}
			
			// 我的任务确认筛选
			function confirmMyTaskTimeFilter() {
				myTaskStartPublishDate.value = tempMyTaskStartPublishDate.value
				myTaskEndPublishDate.value = tempMyTaskEndPublishDate.value
				myTaskStartDeadlineDate.value = tempMyTaskStartDeadlineDate.value
				myTaskEndDeadlineDate.value = tempMyTaskEndDeadlineDate.value
				myTaskStartAcceptDate.value = tempMyTaskStartAcceptDate.value
				myTaskEndAcceptDate.value = tempMyTaskEndAcceptDate.value
				myTaskStartCompleteDate.value = tempMyTaskStartCompleteDate.value
				myTaskEndCompleteDate.value = tempMyTaskEndCompleteDate.value
				showMyTaskTimeFilter.value = false
				fetchMyTasks()
			}
			
			function confirmMyTaskBadgeFilter() {
				myTaskMinLevel.value = tempMyTaskMinLevel.value
				myTaskMaxLevel.value = tempMyTaskMaxLevel.value
				showMyTaskBadgeFilter.value = false
				fetchMyTasks()
			}
			
			function confirmMyTaskSortFilter() {
				showMyTaskSortSelector.value = false
				fetchMyTasks()
			}
			
			// 我的任务清除筛选
			function clearMyTaskTimeFilter() {
				tempMyTaskStartPublishDate.value = ""
				tempMyTaskEndPublishDate.value = ""
				tempMyTaskStartDeadlineDate.value = ""
				tempMyTaskEndDeadlineDate.value = ""
				tempMyTaskStartAcceptDate.value = ""
				tempMyTaskEndAcceptDate.value = ""
				tempMyTaskStartCompleteDate.value = ""
				tempMyTaskEndCompleteDate.value = ""
				myTaskStartPublishDate.value = ""
				myTaskEndPublishDate.value = ""
				myTaskStartDeadlineDate.value = ""
				myTaskEndDeadlineDate.value = ""
				myTaskStartAcceptDate.value = ""
				myTaskEndAcceptDate.value = ""
				myTaskStartCompleteDate.value = ""
				myTaskEndCompleteDate.value = ""
			}
			
			function clearMyTaskBadgeFilter() {
				tempMyTaskMinLevel.value = null
				tempMyTaskMaxLevel.value = null
				myTaskMinLevel.value = null
				myTaskMaxLevel.value = null
			}
			
			function clearMyTaskSortFilter() {
				myTaskSortBy.value = ''
				myTaskSortDirection.value = 'DESC'
			}
			
			// 我的任务筛选文本显示
			function getMyTaskTimeFilterText() {
				const publishText = myTaskStartPublishDate.value || myTaskEndPublishDate.value ? 
					`发布: ${myTaskStartPublishDate.value || '不限'} ~ ${myTaskEndPublishDate.value || '不限'}` : ''
				const deadlineText = myTaskStartDeadlineDate.value || myTaskEndDeadlineDate.value ? 
					`截止: ${myTaskStartDeadlineDate.value || '不限'} ~ ${myTaskEndDeadlineDate.value || '不限'}` : ''
				const acceptText = myTaskStartAcceptDate.value || myTaskEndAcceptDate.value ? 
					`接取: ${myTaskStartAcceptDate.value || '不限'} ~ ${myTaskEndAcceptDate.value || '不限'}` : ''
				const completeText = myTaskStartCompleteDate.value || myTaskEndCompleteDate.value ? 
					`完成: ${myTaskStartCompleteDate.value || '不限'} ~ ${myTaskEndCompleteDate.value || '不限'}` : ''
				
				const texts = [publishText, deadlineText, acceptText, completeText].filter(t => t)
				if (texts.length > 0) {
					return texts.join(' | ')
				} else {
					return '选择时间范围'
				}
			}
			
			function getMyTaskBadgeFilterText() {
				if (myTaskMinLevel.value && myTaskMaxLevel.value) {
					return `等级 ${myTaskMinLevel.value} ~ ${myTaskMaxLevel.value}`
				} else if (myTaskMinLevel.value) {
					return `等级 ≥ ${myTaskMinLevel.value}`
				} else if (myTaskMaxLevel.value) {
					return `等级 ≤ ${myTaskMaxLevel.value}`
				} else {
					return '选择等级范围'
				}
			}
			
			function getMyTaskSortFilterText() {
				if (!myTaskSortBy.value) {
					return '默认排序'
				}
				const fieldNames = {
					'publishTime': '发布时间',
					'deadline': '截止时间',
					'reward': '奖励金额',
					'level': '技能等级',
					'challengeStartTime': '接取时间',
					'challengeEndTime': '完成时间'
				}
				const directionNames = {
					'DESC': '降序',
					'ASC': '升序'
				}
				return `${fieldNames[myTaskSortBy.value]} ${directionNames[myTaskSortDirection.value]}`
			}
			
			// 我的任务排序设置
			function setMyTaskSortBy(field) {
				myTaskSortBy.value = field
				if (!field) {
					myTaskSortDirection.value = 'DESC'
				}
			}
			
			function setMyTaskSortDirection(direction) {
				myTaskSortDirection.value = direction
			}
			
			// 我的任务清除单个筛选
			function clearMyTaskStartPublishDate() {
				tempMyTaskStartPublishDate.value = ""
			}
			
			function clearMyTaskEndPublishDate() {
				tempMyTaskEndPublishDate.value = ""
			}
			
			function clearMyTaskStartDeadlineDate() {
				tempMyTaskStartDeadlineDate.value = ""
			}
			
			function clearMyTaskEndDeadlineDate() {
				tempMyTaskEndDeadlineDate.value = ""
			}
			
			function clearMyTaskStartAcceptDate() {
				tempMyTaskStartAcceptDate.value = ""
			}
			
			function clearMyTaskEndAcceptDate() {
				tempMyTaskEndAcceptDate.value = ""
			}
			
			function clearMyTaskStartCompleteDate() {
				tempMyTaskStartCompleteDate.value = ""
			}
			
			function clearMyTaskEndCompleteDate() {
				tempMyTaskEndCompleteDate.value = ""
			}
			
			function clearMyTaskPublishTimeFilter() {
				tempMyTaskStartPublishDate.value = ""
				tempMyTaskEndPublishDate.value = ""
			}
			
			function clearMyTaskDeadlineTimeFilter() {
				tempMyTaskStartDeadlineDate.value = ""
				tempMyTaskEndDeadlineDate.value = ""
			}
			
			function clearMyTaskAcceptTimeFilter() {
				tempMyTaskStartAcceptDate.value = ""
				tempMyTaskEndAcceptDate.value = ""
			}
			
			function clearMyTaskCompleteTimeFilter() {
				tempMyTaskStartCompleteDate.value = ""
				tempMyTaskEndCompleteDate.value = ""
			}
			
			function clearMyTaskMinLevel() {
				tempMyTaskMinLevel.value = null
			}
			
			function clearMyTaskMaxLevel() {
				tempMyTaskMaxLevel.value = null
			}
			
			function clearMyTaskBadgeLevelFilter() {
				tempMyTaskMinLevel.value = null
				tempMyTaskMaxLevel.value = null
			}
			
			// 我的任务地区筛选方法
			function openMyTaskRegionSelector() {
				showMyTaskRegionSelector.value = true
				// 默认选中全部
				tempMyTaskProvince.value = ''
				tempMyTaskCity.value = ''
				tempMyTaskDistrict.value = null
			}
			
			function selectTempMyTaskProvince(province) {
				tempMyTaskProvince.value = province
				// 选中一级，下级重置为全部
				tempMyTaskCity.value = ''
				tempMyTaskDistrict.value = null
			}
			
			function selectTempMyTaskCity(city) {
				tempMyTaskCity.value = city
				// 选中二级，下级重置为全部
				tempMyTaskDistrict.value = null
			}
			
			function selectTempMyTaskDistrict(district) {
				tempMyTaskDistrict.value = district
			}
			
			function confirmMyTaskRegion() {
				myTaskProvince.value = tempMyTaskProvince.value
				myTaskCity.value = tempMyTaskCity.value
				myTaskDistrict.value = tempMyTaskDistrict.value ? tempMyTaskDistrict.value.name : ""
				// adCode 取值严格按 geoUtils 结构
				if (tempMyTaskDistrict.value && tempMyTaskDistrict.value.adcode) {
					myTaskAdCode.value = tempMyTaskDistrict.value.adcode; // 区级
				} else if (tempMyTaskCity.value) {
					const provinceObj = geoData.find(p => p.name === tempMyTaskProvince.value);
					const cityObj = provinceObj?.cities.find(c => c.name === tempMyTaskCity.value);
					myTaskAdCode.value = cityObj?.adcode || ""; // 市级
				} else if (tempMyTaskProvince.value) {
					const provinceObj = geoData.find(p => p.name === tempMyTaskProvince.value);
					myTaskAdCode.value = provinceObj?.adcode || ""; // 省级
				} else {
					myTaskAdCode.value = "";
				}
				showMyTaskRegionSelector.value = false
				fetchMyTasks()
			}
			
			function getMyTaskRegionText() {
				if (myTaskProvince.value || myTaskCity.value || myTaskDistrict.value) {
					return `${myTaskProvince.value || '全部'}${myTaskCity.value ? ' / ' + myTaskCity.value : ''}${myTaskDistrict.value ? ' / ' + myTaskDistrict.value : ''}`
				} else {
					return '选择地区'
				}
			}
			
			// 我的任务类别筛选方法
			function openMyTaskTypeSelector() {
				showMyTaskTypeSelector.value = true
				// 默认选中全部
				tempMyTaskField.value = ''
				tempMyTaskCategory.value = ''
				tempMyTaskDirection.value = ''
			}
			
			function selectTempMyTaskField(code) {
				tempMyTaskField.value = code
				// 选中一级，下级重置为全部
				tempMyTaskCategory.value = ''
				tempMyTaskDirection.value = ''
			}
			
			function selectTempMyTaskCategory(code) {
				tempMyTaskCategory.value = code
				// 选中二级，下级重置为全部
				tempMyTaskDirection.value = ''
			}
			
			function selectTempMyTaskDirection(code) {
				tempMyTaskDirection.value = code
			}
			
			function confirmMyTaskType() {
				myTaskField.value = tempMyTaskField.value;
				myTaskCategory.value = tempMyTaskCategory.value;
				myTaskDirection.value = tempMyTaskDirection.value;
				showMyTaskTypeSelector.value = false;
				fetchMyTasks()
			}
			
			function getMyTaskTypeText() {
				if (myTaskField.value || myTaskCategory.value || myTaskDirection.value) {
					const fieldName = fields.value.find(f => f.code === myTaskField.value)?.name || ''
					const categoryName = fields.value.find(f => f.code === myTaskField.value)?.subcategories.find(c => c.code === myTaskCategory.value)?.name || ''
					const directionName = fields.value.find(f => f.code === myTaskField.value)?.subcategories.find(c => c.code === myTaskCategory.value)?.directions.find(d => d.code === myTaskDirection.value)?.name || ''
					
					const parts = [fieldName, categoryName, directionName].filter(p => p)
					return parts.join(' / ') || '选择类别'
				} else {
					return '选择类别'
				}
			}
			
			// 获取任务类型文本（基于团队成员数量，所有任务都是团队任务）
			const getChallengeTypeText = (teamInfo) => {
				// 所有任务都是团队任务，根据成员数量显示
				if (teamInfo) {
					const memberCount = getMemberCount(teamInfo);
					return getTaskTypeByMemberCount(memberCount);
				}
				return '团队任务';
			};
			
			// 根据团队成员数量获取任务类型文本
			const getTaskTypeByMemberCount = (count) => {
				if (!count || count <= 0) return '团队任务';
				if (count === 1) return '1人任务';
				if (count === 2) return '2人任务';
				if (count === 3) return '3人任务';
				if (count === 4) return '4人任务';
				if (count === 5) return '5人任务';
				if (count === 6) return '6人任务';
				if (count === 7) return '7人任务';
				if (count === 8) return '8人任务';
				if (count === 9) return '9人任务';
				if (count === 10) return '10人任务';
				// 10人以上使用阿拉伯数字
				return `${count}人任务`;
			};
			
			// 获取团队成员数量
			const getMemberCount = (teamInfo) => {
				if (!teamInfo) return 0;
				// 优先使用 memberCount 字段
				if (teamInfo.memberCount !== undefined && teamInfo.memberCount !== null) {
					return Number(teamInfo.memberCount);
				}
				// 如果没有 memberCount，尝试从 members 数组获取
				if (Array.isArray(teamInfo.members)) {
					return teamInfo.members.length;
				}
				// 默认返回 0
				return 0;
			};

			// 获取挑战类型class
			const getChallengeTypeClass = (type) => {
				if (type === 'single') return 'challenge-type-single';
				if (type === 'team') return 'challenge-type-team';
				return 'challenge-type-unknown';
			};

			// 获取挑战类型徽章文本
			const getChallengeTypeBadgeText = (type) => {
				if (type === 'single') return '个人';
				if (type === 'team') return '团队';
				return '未知';
			};

			// 获取挑战类型徽章class
			const getChallengeTypeBadgeClass = (type) => {
				if (type === 'single') return 'badge-single';
				if (type === 'team') return 'badge-team';
				return 'badge-unknown';
			};

			// 获取角色class
			const getRoleClass = (role) => {
				if (role === 'leader') return 'role-leader';
				if (role === 'member') return 'role-member';
				return 'role-unknown';
			};

			return {
				provinces,
				cities,
				districts,
				selectedProvince,
				selectedCity,
				selectedDistrict,
				fields,
				selectedField,
				selectedCategory,
				selectedDirection,
				categoryList, // 返回 categoryList
				directions,
				tasks,
				defaultAvatar,
				currentPage,
				pageSize,
				keyword,
				totalPages,
				fetchTasks,
				updatecategoryList,
				updateDirections,
				handleDirectionChange,
				updateCities,
				updateDistricts,
				getSelectedAdcode,
				handleSearch,
				formatReward,
				formatDateTime,
				getBadgeName,
				getLocationName,
				changePage,
				changePageSize,
				selectedAdCode,
				goToPublishTask,
				goToRecentPushes,
				goToTaskDetail,
				getPageList,
                goCompany,
				drawerOpen,
				isMobile,
				userStore,
				safeUserProfile,
				goToMyProfile,
				goToUserProfile,
				goToNewPeople,
				goToSponsorship,
				goToApex,
				goToMyTask,
				goToMessage,
				goToEducation,
				showRegionPopup,
				showDirectionPopup,
				getDirectionLabel,
				selectProvince,
				selectCity,
				selectDistrict,
				selectField,
				selectCategory,
				selectDirection,
				// 类型选择弹窗相关
				showTypeSelector,
				tempField,
				tempCategory,
				tempDirection,
				openTypeSelector,
				selectTempField,
				selectTempCategory,
				selectTempDirection,
				confirmType,

				showRegionSelector,
				tempProvince,
				tempCity,
				tempDistrict,
				openRegionSelector,
				selectTempProvince,
				selectTempCity,
				selectTempDistrict,
				confirmRegion,
				geoData,
				// 时间筛选相关
				showTimeFilter,
				tempStartPublishDate,
				tempEndPublishDate,
				tempStartDeadlineDate,
				tempEndDeadlineDate,
				startPublishDate,
				endPublishDate,
				startDeadlineDate,
				endDeadlineDate,
				openTimeFilter,
				onStartPublishDateChange,
				onEndPublishDateChange,
				onStartDeadlineDateChange,
				onEndDeadlineDateChange,
				confirmTimeFilter,
				clearTimeFilter,
				getTimeFilterText,
				// 铭牌等级筛选相关
				showBadgeFilter,
				tempMinLevel,
				tempMaxLevel,
				minLevel,
				maxLevel,
				openBadgeFilter,
				confirmBadgeFilter,
				clearBadgeFilter,
				getBadgeFilterText,
				// 单独清除方法
				clearStartPublishDate,
				clearEndPublishDate,
				clearStartDeadlineDate,
				clearEndDeadlineDate,
				clearPublishTimeFilter,
				clearDeadlineTimeFilter,
				clearMinLevel,
				clearMaxLevel,
				clearBadgeLevelFilter,
				// 排序筛选相关
				showSortSelector,
				sortBy,
				sortDirection,
				openSortFilter,
				setSortBy,
				setSortDirection,
				confirmSortFilter,
				clearSortFilter,
				getSortFilterText,
				// 图片处理函数
				getAvatarUrl,
				handleAvatarError,
				handleTaskAvatarError,
				// 任务切换相关
				currentTab,
				myTasks,
				myTasksLoading,
				myTaskType,
				myTaskFilters,
				switchTab,
				switchMyTaskType,
				setMyTaskStatus,
				setTeamRole,
				setTeamMemberCount,
				getRangeDisplayText,
				showTeamMemberCountRangeSelector,
				customMinMemberCount,
				customMaxMemberCount,
				validateCustomRange,
				confirmCustomRange,
				cancelCustomRange,
				clearCustomRange,
				openTeamMemberCountRangeSelector,
				fetchMyTasks,
				getStatusText,
				// 我的任务筛选相关
				showMyTaskTimeFilter,
				showMyTaskBadgeFilter,
				showMyTaskSortSelector,
				tempMyTaskStartPublishDate,
				tempMyTaskEndPublishDate,
				tempMyTaskStartDeadlineDate,
				tempMyTaskEndDeadlineDate,
				tempMyTaskStartAcceptDate,
				tempMyTaskEndAcceptDate,
				tempMyTaskStartCompleteDate,
				tempMyTaskEndCompleteDate,
				myTaskStartPublishDate,
				myTaskEndPublishDate,
				myTaskStartDeadlineDate,
				myTaskEndDeadlineDate,
				myTaskStartAcceptDate,
				myTaskEndAcceptDate,
				myTaskStartCompleteDate,
				myTaskEndCompleteDate,
				tempMyTaskMinLevel,
				tempMyTaskMaxLevel,
				myTaskMinLevel,
				myTaskMaxLevel,
				myTaskSortBy,
				myTaskSortDirection,
				openMyTaskTimeFilter,
				openMyTaskBadgeFilter,
				openMyTaskSortFilter,
				onMyTaskStartPublishDateChange,
				onMyTaskEndPublishDateChange,
				onMyTaskStartDeadlineDateChange,
				onMyTaskEndDeadlineDateChange,
				onMyTaskStartAcceptDateChange,
				onMyTaskEndAcceptDateChange,
				onMyTaskStartCompleteDateChange,
				onMyTaskEndCompleteDateChange,
				confirmMyTaskTimeFilter,
				confirmMyTaskBadgeFilter,
				confirmMyTaskSortFilter,
				clearMyTaskTimeFilter,
				clearMyTaskBadgeFilter,
				clearMyTaskSortFilter,
				getMyTaskTimeFilterText,
				getMyTaskBadgeFilterText,
				getMyTaskSortFilterText,
				setMyTaskSortBy,
				setMyTaskSortDirection,
				clearMyTaskStartPublishDate,
				clearMyTaskEndPublishDate,
				clearMyTaskStartDeadlineDate,
				clearMyTaskEndDeadlineDate,
				clearMyTaskStartAcceptDate,
				clearMyTaskEndAcceptDate,
				clearMyTaskStartCompleteDate,
				clearMyTaskEndCompleteDate,
				clearMyTaskPublishTimeFilter,
				clearMyTaskDeadlineTimeFilter,
				clearMyTaskAcceptTimeFilter,
				clearMyTaskCompleteTimeFilter,
				clearMyTaskMinLevel,
				clearMyTaskMaxLevel,
				clearMyTaskBadgeLevelFilter,
				// 我的任务地区和类别筛选
				showMyTaskRegionSelector,
				showMyTaskTypeSelector,
				tempMyTaskProvince,
				tempMyTaskCity,
				tempMyTaskDistrict,
				myTaskProvince,
				myTaskCity,
				myTaskDistrict,
				myTaskAdCode,
				tempMyTaskField,
				tempMyTaskCategory,
				tempMyTaskDirection,
				myTaskField,
				myTaskCategory,
				myTaskDirection,
				openMyTaskRegionSelector,
				selectTempMyTaskProvince,
				selectTempMyTaskCity,
				selectTempMyTaskDistrict,
				confirmMyTaskRegion,
				getMyTaskRegionText,
				openMyTaskTypeSelector,
				selectTempMyTaskField,
				selectTempMyTaskCategory,
				selectTempMyTaskDirection,
				confirmMyTaskType,
				getMyTaskTypeText,
				// 挑战类型相关方法
				getChallengeTypeText,
				getTaskTypeByMemberCount,
				getMemberCount,
				getChallengeTypeClass,
				getChallengeTypeBadgeText,
				getChallengeTypeBadgeClass,
				getRoleClass,
				// 未读推送相关
				unreadPushCount,
				fetchUnreadPushCount
			};
		},
	};
</script>

<style scoped>
	.home-page {
		background: #f5f5f5;
		min-height: 100vh;
		padding-bottom: 80px;
	}

	/* 顶部导航栏 */
	.header {
		background: #4A90E2;
		color: white;
		padding: 12px 16px;
		z-index: 100;
	}

	.header-content {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.logo {
		font-size: 20px;
		font-weight: bold;
		color: white;
	}

	.header-right {
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.rating {
		display: flex;
		align-items: center;
		gap: 4px;
	}

	.star {
		color: #ffd700;
		font-size: 16px;
	}

	.rating-score {
		font-size: 14px;
	}

	.record-btn {
		background: none;
		border: 2px solid white;
		color: white;
		width: 32px;
		height: 32px;
		border-radius: 50%;
		font-size: 18px;
		cursor: pointer;
	}

	/* 搜索栏 */
	.search-section {
		background: #4A90E2;
		padding: 0 16px 16px;
	}

	.search-input-wrapper {
		position: relative;
		display: flex;
		align-items: center;
	}

	.search-input {
		width: 100%;
		padding: 12px 16px;
		border: none;
		border-radius: 24px;
		background: white;
		font-size: 16px;
		outline: none;
	}

	.search-btn {
		position: absolute;
		right: 8px;
		background: none;
		border: none;
		padding: 8px;
		cursor: pointer;
	}

	/* 快捷入口 */
	.quick-entry {
		background: white;
		margin: 16px;
		border-radius: 12px;
		padding: 16px;
	}

	.entry-grid {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 16px;
	}

	.entry-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		cursor: pointer;
		min-width: 20px;
		/* 增加最小宽度 */
		/* width: 100px;       或者直接设置固定宽度 */
		flex: 1 1 100px;
		/* 让其在父容器中自适应分布 */
	}

	/* 发布任务按钮区域 */
	.publish-task-section {
		margin: 20px 16px;
	}

	.publish-task-button {
		width: 100%;
		background: linear-gradient(135deg, #4A90E2, #357ABD);
		border: none;
		border-radius: 12px;
		padding: 12px 20px;
		box-shadow: 0 4px 15px rgba(74, 144, 226, 0.3);
		transition: all 0.3s ease;
		cursor: pointer;
		position: relative;
		overflow: hidden;
	}

	.publish-task-button:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 25px rgba(74, 144, 226, 0.4);
	}

	.publish-task-button:active {
		transform: translateY(0);
		box-shadow: 0 4px 15px rgba(74, 144, 226, 0.3);
	}

	.button-content {
		display: flex;
		align-items: center;
		gap: 12px;
		position: relative;
		z-index: 2;
	}

	.button-icon {
		font-size: 24px;
		flex-shrink: 0;
	}

	.button-text {
		flex: 1;
		text-align: left;
	}

	.button-title {
		color: white;
		font-size: 18px;
		font-weight: 700;
		margin-bottom: 2px;
		line-height: 1.2;
	}

	.button-subtitle {
		color: rgba(255, 255, 255, 0.9);
		font-size: 13px;
		font-weight: 400;
		line-height: 1.2;
	}

	.button-arrow {
		color: white;
		font-size: 20px;
		font-weight: bold;
		flex-shrink: 0;
		transition: transform 0.3s ease;
	}

	.publish-task-button:hover .button-arrow {
		transform: translateX(4px);
	}

	/* 移动端响应式样式 */
	@media (max-width: 768px) {
		.publish-task-section {
			margin: 16px 12px;
		}

		.publish-task-button {
			padding: 10px 16px;
			border-radius: 10px;
		}

		.button-content {
			gap: 10px;
		}

		.button-icon {
			font-size: 20px;
		}

		.button-title {
			font-size: 16px;
		}

		.button-subtitle {
			font-size: 12px;
		}

		.button-arrow {
			font-size: 18px;
		}
	}

	.entry-icon {
		width: 48px;
		height: 48px;
		border-radius: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24px;
	}

	.publish-icon {
		background: #ff6b35;
	}

	.task-icon {
		background: #4ecdc4;
	}

	.gift-icon {
		background: #ff9500;
	}

	.chart-icon {
		background: #a8e6cf;
	}

	.education-icon {
		background: #ffd93d;
	}

	.entry-text {
		font-size: 12px;
		color: #333;
	}

	/* 信息卡片 */
	.info-cards {
		display: flex;
		gap: 10px;
		margin: 0 16px 16px;
	}

	.info-card {
		flex: 1 1 0;
		min-width: 0;
		background: #fff;
		border-radius: 12px;
		padding: 16px;
		display: flex;
		align-items: center;
		gap: 12px;
		cursor: pointer;
		box-sizing: border-box;
	}


	.info-icon {
		font-size: 24px;
	}

	.info-content {
		flex: 1;
	}

	.info-title {
		font-size: 15px;
		font-weight: bold;
		color: #333;
		margin-bottom: 3px;
	}

	.info-desc {
		font-size: 10px;
		color: #999;
	}

	.info-arrow {
		font-size: 18px;
		color: #999;
	}

	/* 分类标签 */
	.category-tabs {
		background: white;
		margin: 0 16px 16px;
		border-radius: 12px;
		padding: 16px;
	}

	.tab-list {
		display: flex;
		gap: 16px;
		align-items: center;
	}

	.tab-item {
		padding: 8px 16px;
		border-radius: 20px;
		font-size: 14px;
		cursor: pointer;
		transition: all 0.3s;
	}

	.tab-item.active {
		background: #4A90E2;
		color: white;
	}

	.tab-add {
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: #f0f0f0;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		font-size: 18px;
		color: #666;
	}

	/* 任务完成提示 */
	.task-completion {
		margin: 0 16px 16px;
	}

	.completion-card {
		background: white;
		border-radius: 12px;
		padding: 16px;
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.completion-icon {
		font-size: 24px;
	}

	.completion-text {
		flex: 1;
		font-size: 14px;
		color: #333;
	}

	.completion-btn {
		background: #4A90E2;
		color: white;
		border: none;
		padding: 8px 16px;
		border-radius: 20px;
		font-size: 14px;
		cursor: pointer;
	}

	/* 任务列表 */
	.task-list {
		margin: 0 16px;
	}

	.task-item {
		background: white;
		border-radius: 16px;
		padding: 16px;
		margin-bottom: 16px;
		cursor: pointer;
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
		border: 1px solid rgba(0, 0, 0, 0.05);
	}

	.task-item:hover {
		transform: translateY(-2px);
		box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	}

	.task-item:active {
		transform: translateY(0);
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	}

	/* 任务卡片头部 */
	.task-card-header {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 12px;
		gap: 12px;
	}

	.task-left-section {
		display: flex;
		align-items: flex-start;
		gap: 12px;
		flex: 1;
		min-width: 0;
	}

	.publisher-avatar-section {
		flex-shrink: 0;
	}

	.publisher-avatar {
		width: 48px;
		height: 48px;
		border-radius: 50%;
		object-fit: cover;
		border: 2px solid #f0f0f0;
		background: #f8f9fa;
		transition: all 0.3s ease;
	}

	.publisher-avatar:hover {
		border-color: #4A90E2;
		transform: scale(1.05);
	}

	.task-basic-info {
		flex: 1;
		min-width: 0;
	}

	.task-title {
		font-size: 16px;
		font-weight: 600;
		color: #2c3e50;
		margin: 0 0 4px 0;
		line-height: 1.4;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		word-break: break-word;
	}

	.org-name {
		font-size: 13px;
		color: #666;
		font-weight: 500;
		margin: 0;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		overflow: hidden;
		cursor: pointer;
		transition: color 0.2s;
	}

	.org-name:hover {
		color: #007AFF;
		text-decoration: underline;
	}

	.task-salary-section {
		flex-shrink: 0;
		text-align: right;
	}

	.task-salary {
		font-size: 18px;
		color: #e74c3c;
		font-weight: 700;
		white-space: nowrap;
		background: linear-gradient(135deg, #ff6b6b, #ee5a24);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text;
	}

	.task-description-section {
		margin-bottom: 10px;
	}
	.task-description {
		font-size: 14px;
		color: #444;
		line-height: 1.6;
		margin: 0;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		word-break: break-word;
	}

	/* 任务时间信息样式 */
	.task-time-info {
		background: #f8f9fa;
		border-radius: 8px;
		padding: 12px;
		margin: 8px 0;
		border-left: 3px solid #3498db;
	}

	.time-item {
		display: flex;
		align-items: center;
		margin-bottom: 6px;
		font-size: 13px;
	}

	.time-item:last-child {
		margin-bottom: 0;
	}

	.time-icon {
		font-size: 14px;
		margin-right: 6px;
		opacity: 0.8;
	}

	.time-label {
		color: #666;
		font-weight: 500;
		margin-right: 4px;
		min-width: 60px;
	}

	.time-value {
		color: #2c3e50;
		font-weight: 600;
		flex: 1;
	}

	/* 截止时间特殊样式 */
	.time-item:last-child .time-value {
		color: #e74c3c;
		font-weight: 600;
	}

	.time-item:last-child .time-icon {
		color: #e74c3c;
	}

	/* 我的任务时间信息样式 */
	.my-task-time-info {
		background: #f0f8ff;
		border-radius: 6px;
		padding: 10px;
		margin: 8px 0;
		border-left: 3px solid #4A90E2;
	}

	.my-time-item {
		display: flex;
		align-items: center;
		margin-bottom: 4px;
		font-size: 12px;
	}

	.my-time-item:last-child {
		margin-bottom: 0;
	}

	.my-time-icon {
		font-size: 12px;
		margin-right: 4px;
		opacity: 0.8;
	}

	.my-time-label {
		color: #666;
		font-weight: 500;
		margin-right: 4px;
		min-width: 50px;
	}

	.my-time-value {
		color: #2c3e50;
		font-weight: 600;
		flex: 1;
	}

	/* 我的任务截止时间特殊样式 */
	.my-time-item:last-child .my-time-value {
		color: #e74c3c;
		font-weight: 600;
	}

	.my-time-item:last-child .my-time-icon {
		color: #e74c3c;
	}

	.task-card-footer {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 8px;
		gap: 12px;
	}
	.publisher-info {
		display: flex;
		align-items: center;
		gap: 6px;
		font-size: 13px;
		color: #4A90E2;
		font-weight: 500;
		cursor: pointer;
	}

	.location-info {
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.location-item, .distance-item {
		display: flex;
		align-items: center;
		gap: 2px;
		font-size: 12px;
		color: #888;
	}
	.location-icon, .distance-icon {
		font-size: 13px;
		margin-right: 2px;
	}
	.distance-text {
		color: #e67e22;
		font-weight: 600;
	}

	@media (max-width: 600px) {
		.task-item {
			padding: 12px;
			border-radius: 12px;
		}
		.publisher-avatar {
			width: 40px;
			height: 40px;
		}
		.task-title {
			font-size: 15px;
		}
		.org-name {
			font-size: 12px;
		}
		.task-salary {
			font-size: 16px;
		}
		.task-description {
			font-size: 13px;
		}
		.task-time-info {
			padding: 8px;
			margin: 6px 0;
		}
		.time-item {
			font-size: 12px;
		}
		.time-label {
			min-width: 50px;
		}
		.my-task-time-info {
			padding: 6px;
			margin: 6px 0;
		}
		.my-time-item {
			font-size: 11px;
		}
		.my-time-label {
			min-width: 40px;
		}
		.location-item, .distance-item {
			font-size: 11px;
		}
	}
	@media (max-width: 400px) {
		.task-item {
			padding: 8px;
		}
		.publisher-avatar {
			width: 32px;
			height: 32px;
		}
	}

	/* 我要招聘按钮 */
	.recruit-btn-wrapper {
		position: fixed;
		bottom: 100px;
		right: 16px;
		z-index: 99;
	}

	.recruit-btn {
		background: #4A90E2;
		color: white;
		border: none;
		padding: 12px 24px;
		border-radius: 24px;
		font-size: 16px;
		font-weight: bold;
		cursor: pointer;
		box-shadow: 0 4px 12px rgba(0, 179, 138, 0.3);
	}

	/* 底部导航栏 */
	.bottom-nav {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		background: white;
		display: flex;
		justify-content: space-around;
		padding: 8px 0;
		border-top: 1px solid #eee;
		z-index: 100;
	}

	.nav-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 4px;
		cursor: pointer;
		padding: 4px 8px;
	}

	.nav-item.active .nav-text {
		color: #4A90E2;
	}

	.nav-icon {
		font-size: 20px;
	}

	.nav-text {
		font-size: 10px;
		color: #999;
	}

	.nav-item.active .nav-text {
		color: #4A90E2;
	}

	/* 响应式设计 */
	@media (max-width: 480px) {
		.entry-grid {
			grid-template-columns: repeat(5, 1fr);
		}

		.entry-icon {
			width: 40px;
			height: 40px;
			font-size: 20px;
		}

		.entry-text {
			font-size: 11px;
		}
	}

	.home-page {
		background: #f5f5f5;
		min-height: 100vh;
		padding-bottom: 80px;
	}

	/* 顶部导航栏 */
	.header {
		background: #4A90E2;
		color: white;
		padding: 12px 16px;
		z-index: 100;
	}

	.header-content {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.logo {
		font-size: 20px;
		font-weight: bold;
		color: white;
	}

	.header-right {
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.rating {
		display: flex;
		align-items: center;
		gap: 4px;
	}

	.star {
		color: #ffd700;
		font-size: 16px;
	}

	.rating-score {
		font-size: 14px;
	}

	.record-btn {
		background: none;
		border: 2px solid white;
		color: white;
		width: 32px;
		height: 32px;
		border-radius: 50%;
		font-size: 18px;
		cursor: pointer;
	}

	/* 搜索栏 */
	.search-section {
		background: #4A90E2;
		padding: 0 16px 16px;
	}

	.search-input-wrapper {
		position: relative;
		display: flex;
		align-items: center;
	}

	.search-input {
		width: 100%;
		padding: 12px 16px;
		border: none;
		border-radius: 24px;
		background: white;
		font-size: 16px;
		outline: none;
	}


button.search-btn::after {
  border: none !important;
  background: none !important;
  box-shadow: none !important;
  opacity: 0 !important;
}
.search-btn:focus {
  outline: none !important;
  box-shadow: none !important;
}

.search-btn:active {
  outline: none !important;
  box-shadow: none !important;
}
	.search-icon {
	  border: none;
	  outline: none;
	  background: transparent; /* 可选，确保没有背景 */
	}
	/* 快捷入口 */
	.quick-entry {
		background: white;
		margin: 16px;
		border-radius: 12px;
		padding: 16px;
	}

	.entry-grid {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 16px;
	}

	.entry-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
		cursor: pointer;
	}

	.entry-icon {
		width: 48px;
		height: 48px;
		border-radius: 12px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24px;
	}

	.publish-icon {
		background: #ff6b35;
	}

	.task-icon {
		background: #4ecdc4;
	}

	.gift-icon {
		background: #ff9500;
	}

	.chart-icon {
		background: #a8e6cf;
	}

	.education-icon {
		background: #ffd93d;
	}

	.entry-text {
		font-size: 12px;
		color: #333;
	}

	/* 信息卡片 */
	.info-cards {
		display: flex;
		gap: 10px;
		margin: 0 16px 16px;
	}

	.info-card {
		flex: 1 1 0;
		min-width: 0;
		background: #fff;
		border-radius: 12px;
		padding: 16px;
		display: flex;
		align-items: center;
		gap: 12px;
		cursor: pointer;
		box-sizing: border-box;
	}


	.info-icon {
		font-size: 24px;
	}

	.info-content {
		flex: 1;
	}

	.info-title {
		font-size: 15px;
		font-weight: bold;
		color: #333;
		margin-bottom: 3px;
	}

	.info-desc {
		font-size: 10px;
		color: #999;
	}

	.info-arrow {
		font-size: 18px;
		color: #999;
	}

	/* 分类标签 */
	.category-tabs {
		background: white;
		margin: 0 16px 16px;
		border-radius: 12px;
		padding: 16px;
	}

	.tab-list {
		display: flex;
		gap: 16px;
		align-items: center;
	}

	.tab-item {
		padding: 8px 16px;
		border-radius: 20px;
		font-size: 14px;
		cursor: pointer;
		transition: all 0.3s;
	}

	.tab-item.active {
		background: #4A90E2;
		color: white;
	}

	.tab-add {
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: #f0f0f0;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		font-size: 18px;
		color: #666;
	}

	/* 任务完成提示 */
	.task-completion {
		margin: 0 16px 16px;
	}

	.completion-card {
		background: white;
		border-radius: 12px;
		padding: 16px;
		display: flex;
		align-items: center;
		gap: 12px;
	}

	.completion-icon {
		font-size: 24px;
	}

	.completion-text {
		flex: 1;
		font-size: 14px;
		color: #333;
	}

	.completion-btn {
		background: #4A90E2;
		color: white;
		border: none;
		padding: 8px 16px;
		border-radius: 20px;
		font-size: 14px;
		cursor: pointer;
	}

	/* 任务列表 */
	.task-list {
		margin: 0 16px;
	}

	.task-item {
		background: white;
		border-radius: 12px;
		padding: 16px;
		margin-bottom: 12px;
		cursor: pointer;
		transition: all 0.3s;
	}

	.task-item:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	}

	.task-header {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-bottom: 8px;
	}

	.task-title {
		font-size: 16px;
		font-weight: bold;
		color: #333;
		margin: 0;
		flex: 1;
		margin-right: 12px;
	}

	.task-salary {
		font-size: 16px;
		color: #4A90E2;
		font-weight: bold;
		white-space: nowrap;
	}

	.company-info {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-bottom: 12px;
	}

	.company-name {
		font-size: 14px;
		color: #333;
	}

	.company-size,
	.company-status {
		font-size: 12px;
		color: #999;
	}

	.task-tags {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin-bottom: 12px;
	}

	.tag {
		background: #f0f0f0;
		color: #666;
		padding: 4px 8px;
		border-radius: 12px;
		font-size: 12px;
	}

	.publisher-info {
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.publisher-avatar {
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: #f0f0f0;
	}

	.publisher-details {
		flex: 1;
		display: flex;
		flex-direction: column;
	}

	.publisher-name {
		font-size: 13px;
		color: #333;
		margin-bottom: 2px;
	}

	.publisher-location {
		font-size: 12px;
		color: #999;
	}

	/* 我要招聘按钮 */
	.recruit-btn-wrapper {
		position: fixed;
		bottom: 100px;
		right: 16px;
		z-index: 99;
	}

	.recruit-btn {
		background: #4A90E2;
		color: white;
		border: none;
		padding: 12px 24px;
		border-radius: 24px;
		font-size: 16px;
		font-weight: bold;
		cursor: pointer;
		box-shadow: 0 4px 12px rgba(0, 179, 138, 0.3);
	}

	/* 底部导航栏 */
	.bottom-nav {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		background: white;
		display: flex;
		justify-content: space-around;
		padding: 8px 0;
		border-top: 1px solid #eee;
		z-index: 100;
	}

	.nav-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 4px;
		cursor: pointer;
		padding: 4px 8px;
	}

	.nav-item.active .nav-text {
		color: #4A90E2;
	}

	.nav-icon {
		font-size: 20px;
	}

	.nav-text {
		font-size: 10px;
		color: #999;
	}

	.nav-item.active .nav-text {
		color: #4A90E2;
	}

	/* 响应式设计 */

	.entry-grid {
		grid-template-columns: repeat(5, 1fr);
	}

	.entry-icon {
		width: 40px;
		height: 40px;
		font-size: 20px;
	}

	.entry-text {
		font-size: 11px;
	}

	.user-info {
		display: flex;
		align-items: center;
	}

	.avatar {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		margin-right: 8px;
		object-fit: cover;
		background: #fff;
		border: 2px solid #e0cfff;
	}


	
	.region-popup-mask {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.25);
		z-index: 9999;
		display: flex;
		align-items: flex-end;
		justify-content: center;
	}

	.region-popup {
		width: 100vw;
		max-width: 480px;
		margin: 0 auto;
		background: #fff;
		border-radius: 24px 24px 0 0;
		box-shadow: 0 -4px 24px #e0c3fc33;
		animation: popup-slide-up 0.25s cubic-bezier(.4, 0, .2, 1);
		z-index: 10000;
		padding-bottom: 16px;
		

	}
	@keyframes popup-slide-up {
	  from {
	    transform: translateY(100%);
	    opacity: 0;
	  }
	  to {
	    transform: translateY(0);
	    opacity: 1;
	  }
	}
	.region-picker-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 12px 16px 8px 16px;
		border-bottom: 1px solid #f0f0f0;
	}

	.region-picker-title {
		font-weight: bold;
		font-size: 16px;
	}

	.region-picker-cancel,
	.region-picker-confirm {
		color: #4A90E2;
		font-size: 15px;
		cursor: pointer;
	}

	.region-columns {
		display: flex;
		gap: 0;
		padding: 0 8px;
	}

	.region-list-wrapper {
		position: relative;
		flex: 1;
		min-width: 0;
		max-height: 300px;
		height: 300px;
		overflow: hidden;
		background: #fff;
	}

	.region-list {
		height: 100%;
		overflow-y: auto;
		padding: 0;
		margin: 0;
		list-style: none;
		/* 微信小程序隐藏滚动条 - 使用padding技巧 */
		padding-right: 16px; /* 增加内边距以隐藏滚动条 */
		width: calc(100% + 16px); /* 增加宽度以补偿内边距 */
	}

	.region-list li {
		padding: 12px 0;
		text-align: center;
		cursor: pointer;
		border-radius: 12px;
		transition: background 0.2s, color 0.2s;
		font-size: 15px;
		background: #fff;
		color: #333;
	}

	.region-list li.active,
	.region-list .active {
	  background: #4A90E2 !important;
	  color: #fff !important;
	  font-weight: bold;
	  box-shadow: 0 2px 8px #4A90E233;
	  transform: scale(1.04);
	  transition: all 0.2s;
	  font-size: 15px;
	  padding: 12px 8px;
	}

	.region-list li:not(.active):hover {
		background: #e0cfff;
		color: #4A90E2;
	}

	.gradient-top,
	.gradient-bottom {
		position: absolute;
		left: 0;
		right: 0;
		height: 24px;
		pointer-events: none;
		z-index: 2;
	}

	.gradient-top {
		top: 0;
		background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0));
	}

	.gradient-bottom {
		bottom: 0;
		background: linear-gradient(to top, #fff, rgba(255, 255, 255, 0));
	}
	
	
	/* 任务徽章高级样式 */
	.task-reward-badges {
		margin-top: 12px;
		padding: 0 4px;
	}

	.task-badges {
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		align-items: center;
	}

	.task-badges p {
		margin: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		align-items: center;
	}

	.badge {
		display: inline-flex;
		align-items: center;
		padding: 6px 12px;
		border-radius: 20px;
		font-size: 12px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.5px;
		position: relative;
		overflow: hidden;
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
		border: 2px solid transparent;
		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		color: white;
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	}

	.badge::before {
		content: '';
		position: absolute;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
		transition: left 0.5s;
	}

	.badge:hover::before {
		left: 100%;
	}

	.badge:hover {
		transform: translateY(-2px) scale(1.05);
		box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
		border-color: rgba(255, 255, 255, 0.5);
	}

	/* 不同等级的徽章样式 */
	.badge[data-level="1"] {
		background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);
	}

	.badge[data-level="2"] {
		background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
	}

	.badge[data-level="3"] {
		background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);
	}

	.badge[data-level="4"] {
		background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
	}

	.badge[data-level="5"] {
		background: linear-gradient(135deg, #a18cd1 0%, #fbc2eb 100%);
	}

	/* 特殊徽章样式 */
	.badge[data-level="6"] {
		background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);
		animation: badgeGlow 2s ease-in-out infinite alternate;
	}

	.badge[data-level="7"] {
		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		animation: badgePulse 1.5s ease-in-out infinite;
	}

	.badge[data-level="8"] {
		background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
		animation: badgeShine 3s ease-in-out infinite;
	}

	.badge[data-level="9"] {
		background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
		animation: badgeFloat 2s ease-in-out infinite;
	}

	.badge[data-level="10"] {
		background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
		animation: badgeRainbow 4s linear infinite;
	}

	/* 徽章动画效果 */
	@keyframes badgeGlow {
		0% { box-shadow: 0 2px 8px rgba(255, 154, 158, 0.3); }
		100% { box-shadow: 0 4px 20px rgba(255, 154, 158, 0.6); }
	}

	@keyframes badgePulse {
		0%, 100% { transform: scale(1); }
		50% { transform: scale(1.05); }
	}

	@keyframes badgeShine {
		0% { background-position: -200% center; }
		100% { background-position: 200% center; }
	}

	@keyframes badgeFloat {
		0%, 100% { transform: translateY(0); }
		50% { transform: translateY(-3px); }
	}

	@keyframes badgeRainbow {
		0% { filter: hue-rotate(0deg); }
		100% { filter: hue-rotate(360deg); }
	}

	/* 徽章图标 */
	.badge::after {
		content: '🏆';
		margin-left: 4px;
		font-size: 10px;
		opacity: 0.8;
	}

	/* 无徽章提示样式 */
	.no-badges {
		color: #999;
		font-size: 12px;
		font-style: italic;
		text-align: center;
		padding: 8px;
		background: rgba(0, 0, 0, 0.05);
		border-radius: 8px;
		border: 1px dashed #ddd;
	}

	/* 手机端适配 */
	@media (max-width: 768px) {
		.task-reward-badges {
			margin-top: 8px;
			padding: 0 2px;
		}

		.task-badges {
			gap: 6px;
		}

		.task-badges p {
			gap: 6px;
		}

		.badge {
			padding: 4px 10px;
			font-size: 11px;
			border-radius: 16px;
			letter-spacing: 0.3px;
		}

		.badge::after {
			font-size: 9px;
			margin-left: 3px;
		}

		.no-badges {
			font-size: 11px;
			padding: 6px;
		}
	}

	@media (max-width: 480px) {
		.badge {
			padding: 3px 8px;
			font-size: 10px;
			border-radius: 14px;
		}

		.badge::after {
			font-size: 8px;
			margin-left: 2px;
		}

		.no-badges {
			font-size: 10px;
			padding: 4px;
		}
	}

	/* 时间筛选、铭牌等级筛选和排序筛选样式 */
	.time-filter-card,
	.badge-filter-card,
	.sort-filter-card {
		background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		color: white;
		/* 确保与上方按钮尺寸一致 */
		height: auto;
		min-height: 60px;
	}


	/* 优化筛选按钮文字显示 */
	.time-filter-card .info-content,
	.badge-filter-card .info-content,
	.sort-filter-card .info-content {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		text-align: left;
		width: 100%;
	}

	.time-filter-card .info-title,
	.badge-filter-card .info-title,
	.sort-filter-card .info-title {
		font-size: 16px;
		font-weight: bold;
		color: white;
		margin-bottom: 4px;
		line-height: 1.2;
	}

	.time-filter-card .info-desc,
	.badge-filter-card .info-desc,
	.sort-filter-card .info-desc {
		font-size: 12px;
		color: rgba(255, 255, 255, 0.8);
		line-height: 1.3;
	}

	.time-filter-content,
	.badge-filter-content,
	.sort-filter-content {
		padding: 20px;
		max-height: 60vh;
		overflow-y: auto;
	}

	.filter-section {
		margin-bottom: 24px;
	}

	.filter-section-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 12px;
	}

	.filter-section-title {
		font-size: 16px;
		font-weight: 600;
		color: #2c3e50;
		display: block;
	}

	.clear-section-btn {
		background: #95a5a6;
		color: white;
		border: none;
		padding: 6px 12px;
		border-radius: 12px;
		font-size: 12px;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.3s ease;
	}

	.clear-section-btn:hover {
		background: #7f8c8d;
		transform: translateY(-1px);
	}

	.time-input-group,
	.level-input-group {
		display: flex;
		flex-direction: column;
		gap: 12px;
	}

	.time-input-item,
	.level-input-item {
		display: flex;
		flex-direction: column;
		gap: 6px;
	}

	.time-input-header,
	.level-input-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.time-label,
	.level-label {
		font-size: 14px;
		color: #34495e;
		font-weight: 500;
	}

	.clear-single-btn {
		background: #e74c3c;
		color: white;
		border: none;
		width: 20px;
		height: 20px;
		border-radius: 50%;
		font-size: 12px;
		font-weight: bold;
		cursor: pointer;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.3s ease;
	}

	.clear-single-btn:hover {
		background: #c0392b;
		transform: scale(1.1);
	}

	.time-picker {
		padding: 12px 16px;
		border: 1px solid #ddd;
		border-radius: 8px;
		background: #fff;
		font-size: 14px;
		color: #2c3e50;
		min-height: 44px;
		display: flex;
		align-items: center;
	}

	.level-input {
		padding: 12px 16px;
		border: 1px solid #ddd;
		border-radius: 8px;
		background: #fff;
		font-size: 14px;
		color: #2c3e50;
		min-height: 44px;
	}

	.filter-actions {
		display: flex;
		justify-content: center;
		margin-top: 20px;
	}

	.clear-filter-btn {
		background: #e74c3c;
		color: white;
		border: none;
		padding: 10px 20px;
		border-radius: 20px;
		font-size: 14px;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.3s ease;
	}

	.clear-filter-btn:hover {
		background: #c0392b;
		transform: translateY(-1px);
	}

	/* 排序选择器样式 */
	.sort-options,
	.sort-direction-options {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}

	.sort-option,
	.sort-direction-option {
		padding: 12px 16px;
		border: 1px solid #ddd;
		border-radius: 8px;
		background: #fff;
		cursor: pointer;
		transition: all 0.3s ease;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.sort-option:hover,
	.sort-direction-option:hover {
		border-color: #3498db;
		background: #f8f9fa;
		transform: translateY(-1px);
	}

	.sort-option.active,
	.sort-direction-option.active {
		border-color: #3498db;
		background: #e3f2fd;
		color: #1976d2;
		font-weight: 600;
	}

	.sort-option.active::after,
	.sort-direction-option.active::after {
		content: '✓';
		color: #1976d2;
		font-weight: bold;
	}

	/* 团队人数区间提示样式 */
	.range-hint-section {
		margin-top: 12px;
		padding: 12px;
		background: #f5f5f5;
		border-radius: 8px;
		display: flex;
		flex-direction: column;
		gap: 6px;
	}

	.range-hint-text {
		font-size: 14px;
		font-weight: 500;
		color: #333;
		margin-bottom: 4px;
	}

	.range-hint-item {
		font-size: 12px;
		color: #666;
		line-height: 1.6;
	}

	/* 响应式设计 */
	@media (max-width: 600px) {
		.time-input-group,
		.level-input-group {
			gap: 8px;
		}

		.time-picker,
		.level-input {
			padding: 10px 12px;
			font-size: 13px;
			min-height: 40px;
		}

		.filter-section-title {
			font-size: 15px;
		}

		.time-label,
		.level-label {
			font-size: 13px;
		}
	}

	.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 16px 0;
  width: 100%;
}

.page-numbers-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.page-numbers-row button {
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  border: none;
  border-radius: 16px;
  background: #f0f0f0;
  color: #333;
  font-size: 15px;
  transition: background 0.2s, color 0.2s;
  outline: none;
}

.page-numbers-row button.active {
  background: #4A90E2;
  color: #fff;
  font-weight: bold;
}

.page-numbers-row button:disabled {
  background: #e0e0e0;
  color: #aaa;
  cursor: not-allowed;
}

@media (max-width: 600px) {
  .pagination {
    margin: 8px 0;
  }
  .page-numbers-row {
    gap: 4px;
  }
  .page-numbers-row button {
    min-width: 28px;
    height: 28px;
    font-size: 13px;
    padding: 0 6px;
    border-radius: 14px;
  }
}

/* 任务切换标签样式 */
.task-tabs {
  background: white;
  margin: 16px;
  border-radius: 12px;
  padding: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.tab-container {
  display: flex;
  background: #f5f5f5;
  border-radius: 8px;
  padding: 4px;
}

.tab-item {
  flex: 1;
  text-align: center;
  padding: 12px 16px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 500;
  color: #666;
}

.tab-item.active {
  background: white;
  color: #4A90E2;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* 我的任务部分样式 */
.my-task-section {
  margin: 16px;
}

/* 任务类型切换样式 */
.task-type-tabs {
  background: white;
  border-radius: 12px;
  padding: 8px;
  margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  display: flex;
  background: #f5f5f5;
  border-radius: 8px;
  padding: 4px;
}

.type-tab {
  flex: 1;
  text-align: center;
  padding: 12px 16px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-weight: 500;
  color: #666;
}

.type-tab.active {
  background: white;
  color: #4A90E2;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.my-task-filters {
  background: white;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.filter-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.filter-chip {
  padding: 8px 16px;
  border-radius: 20px;
  background: #f5f5f5;
  color: #666;
  cursor: pointer;
  transition: all 0.3s ease;
  font-size: 14px;
}

.filter-chip.active {
  background: #4A90E2;
  color: white;
}

.my-task-list {
  background: white;
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.task-list-new {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.task-card {
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 16px;
  background: white;
  cursor: pointer;
  transition: all 0.3s ease;
}

.task-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.task-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.task-title-new {
  font-size: 18px;
  font-weight: 600;
  color: #333;
  margin: 0;
  flex: 1;
  line-height: 1.4;
}

.task-salary-new {
  font-size: 20px;
  font-weight: 700;
  color: #4A90E2;
  margin-left: 16px;
}

.task-desc-new {
  color: #666;
  line-height: 1.5;
  margin: 0 0 16px 0;
}

.task-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.publisher-info-new {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
}

.publisher-avatar-new {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.publisher-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.publisher-name-new {
  font-weight: 600;
  color: #333;
  font-size: 14px;
}

.org-name-new {
  color: #666;
  font-size: 12px;
  cursor: pointer;
}

.task-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

.task-location,
.task-distance {
  color: #666;
  font-size: 12px;
}

.task-status {
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
}

.status-0 { background: #fff3cd; color: #856404; }
.status-1 { background: #d4edda; color: #155724; }
.status-2 { background: #cce5ff; color: #004085; }
.status-3 { background: #e2e3e5; color: #383d41; }

.empty-state-new {
  text-align: center;
  padding: 40px 20px;
  color: #666;
}

.empty-icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.empty-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
  color: #333;
}

.empty-desc {
  font-size: 14px;
  color: #666;
}

.loading-spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px;
}

.spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #f3f3f3;
  border-top: 3px solid #4A90E2;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* 我的任务铭牌样式 */
.my-task-reward-badges {
	margin-top: 12px;
	padding: 0 4px;
}

.my-task-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.my-task-badges p {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.my-task-badges .badge {
	display: inline-flex;
	align-items: center;
	padding: 4px 8px;
	border-radius: 16px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	position: relative;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
	border: 2px solid transparent;
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: white;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.my-task-badges .badge::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
	transition: left 0.5s;
}

.my-task-badges .badge:hover::before {
	left: 100%;
}

.my-task-badges .badge:hover {
	transform: translateY(-1px) scale(1.02);
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
	border-color: rgba(255, 255, 255, 0.3);
}

/* 不同等级的铭牌样式 */
.my-task-badges .badge[data-level="1"] {
	background: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);
}

.my-task-badges .badge[data-level="2"] {
	background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
}

.my-task-badges .badge[data-level="3"] {
	background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);
}

.my-task-badges .badge[data-level="4"] {
	background: linear-gradient(135deg, #ff9a9e 0%, #fad0c4 100%);
}

.my-task-badges .badge[data-level="5"] {
	background: linear-gradient(135deg, #a18cd1 0%, #fbc2eb 100%);
}

.my-task-badges .badge[data-level="6"] {
	background: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);
	animation: badgeGlow 2s ease-in-out infinite alternate;
}

.my-task-badges .badge[data-level="7"] {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	animation: badgePulse 1.5s ease-in-out infinite;
}

.my-task-badges .badge[data-level="8"] {
	background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
	animation: badgeShine 3s ease-in-out infinite;
}

.my-task-badges .badge[data-level="9"] {
	background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
	animation: badgeFloat 2s ease-in-out infinite;
}

.my-task-badges .badge[data-level="10"] {
	background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
	animation: badgeRainbow 4s linear infinite;
}

.my-task-badges .badge::after {
	content: '🏆';
	margin-left: 3px;
	font-size: 8px;
	opacity: 0.8;
}

/* 手机端适配 */
@media (max-width: 768px) {
	.my-task-reward-badges {
		margin-top: 8px;
		padding: 0 2px;
	}

	.my-task-badges {
		gap: 4px;
	}

	.my-task-badges p {
		gap: 4px;
	}

	.my-task-badges .badge {
		padding: 3px 6px;
		font-size: 10px;
		border-radius: 12px;
		letter-spacing: 0.2px;
	}

	.my-task-badges .badge::after {
		font-size: 7px;
		margin-left: 2px;
	}
}

@media (max-width: 480px) {
	.my-task-badges .badge {
		padding: 2px 5px;
		font-size: 9px;
		border-radius: 10px;
	}

	.my-task-badges .badge::after {
		font-size: 6px;
		margin-left: 1px;
	}
}

/* 挑战类型信息样式 */
.challenge-type-info {
	margin: 12px 0;
	animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.challenge-type-card {
	border-radius: 12px;
	padding: 16px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
}

.challenge-type-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(90deg, transparent, currentColor, transparent);
	opacity: 0.5;
}

.challenge-type-card:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
	transform: translateY(-2px);
}

/* 单人挑战样式 */
.challenge-type-single {
	background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
	border: 2px solid #2196f3;
	color: #1565c0;
}

.challenge-type-single::before {
	color: #2196f3;
}

/* 组队挑战样式 */
.challenge-type-team {
	background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
	border: 2px solid #9c27b0;
	color: #6a1b9a;
}

.challenge-type-team::before {
	color: #9c27b0;
}

/* 未知类型样式 */
.challenge-type-unknown {
	background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
	border: 2px solid #9e9e9e;
	color: #616161;
}

.challenge-type-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}

.challenge-type-icon {
	font-size: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.challenge-type-title {
	font-size: 16px;
	font-weight: 700;
	flex: 1;
	letter-spacing: 0.5px;
}

.challenge-type-badge {
	padding: 4px 12px;
	border-radius: 16px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.badge-single {
	background: #2196f3;
	color: white;
}

.badge-team {
	background: #9c27b0;
	color: white;
}

.badge-unknown {
	background: #9e9e9e;
	color: white;
}

/* 团队详细信息样式 */
.team-details {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-top: 8px;
	border-top: 1px dashed rgba(106, 27, 154, 0.3);
}

.team-role-info,
.team-name-info,
.team-members-info {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
}

.role-label,
.team-label,
.members-label {
	font-weight: 600;
	color: inherit;
	opacity: 0.8;
}

.role-value {
	padding: 4px 12px;
	border-radius: 12px;
	font-weight: 700;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.role-leader {
	background: #ffd700;
	color: #b8860b;
}

.role-member {
	background: #4caf50;
	color: white;
}

.role-unknown {
	background: #9e9e9e;
	color: white;
}

.team-name {
	font-weight: 700;
	color: inherit;
}

.members-count {
	padding: 2px 8px;
	border-radius: 10px;
	background: rgba(156, 39, 176, 0.2);
	font-weight: 700;
	font-size: 12px;
}

/* 单人挑战详细信息样式 */
.single-details {
	padding-top: 8px;
	border-top: 1px dashed rgba(33, 150, 243, 0.3);
}

.single-info {
	font-size: 13px;
	font-style: italic;
	opacity: 0.8;
	display: flex;
	align-items: center;
	gap: 6px;
}

.single-info::before {
	content: '💪';
	font-size: 16px;
}

/* 手机端适配 */
@media (max-width: 768px) {
	.challenge-type-info {
		margin: 10px 0;
	}

	.challenge-type-card {
		padding: 12px;
	}

	.challenge-type-icon {
		width: 32px;
		height: 32px;
		font-size: 20px;
	}

	.challenge-type-title {
		font-size: 14px;
	}

	.challenge-type-badge {
		padding: 3px 10px;
		font-size: 11px;
	}

	.team-details {
		gap: 6px;
	}

	.team-role-info,
	.team-name-info,
	.team-members-info {
		font-size: 13px;
	}

	.role-value {
		padding: 3px 10px;
		font-size: 13px;
	}

	.members-count {
		font-size: 11px;
	}

	.single-info {
		font-size: 12px;
	}
}

@media (max-width: 480px) {
	.challenge-type-card {
		padding: 10px;
	}

	.challenge-type-header {
		gap: 8px;
	}

	.challenge-type-icon {
		width: 28px;
		height: 28px;
		font-size: 18px;
	}

	.challenge-type-title {
		font-size: 13px;
	}

	.challenge-type-badge {
		padding: 2px 8px;
		font-size: 10px;
	}

	.team-role-info,
	.team-name-info,
	.team-members-info {
		font-size: 12px;
		gap: 6px;
	}

	.role-value {
		padding: 2px 8px;
		font-size: 12px;
	}

	.single-info {
		font-size: 11px;
	}

	.single-info::before {
		font-size: 14px;
	}
}

/* 挑战类型筛选样式 */
.challenge-type-filters {
	margin-top: 16px;
	padding: 16px;
	background: linear-gradient(135deg, #f8f9ff 0%, #e8f2ff 100%);
	border-radius: 12px;
	border: 1px solid #e3f2fd;
	animation: slideIn 0.3s ease-out;
}

.filter-section-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
	font-size: 14px;
	font-weight: 600;
	color: #1976d2;
}

.filter-title-icon {
	font-size: 16px;
}

.filter-title-text {
	letter-spacing: 0.5px;
}

.challenge-filter-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.challenge-filter-chip {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	border-radius: 20px;
	background: white;
	border: 2px solid #e3f2fd;
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 13px;
	font-weight: 500;
	color: #1976d2;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.challenge-filter-chip:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.challenge-filter-chip.active {
	background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);
	border-color: #1976d2;
	color: white;
	box-shadow: 0 4px 12px rgba(33, 150, 243, 0.3);
}

.challenge-filter-chip.active .chip-icon {
	transform: scale(1.1);
}

.chip-icon {
	font-size: 14px;
	transition: transform 0.2s ease;
}

/* 组队角色筛选样式 */
.team-role-filters {
	margin-top: 16px;
	padding: 16px;
	background: linear-gradient(135deg, #f3e5f5 0%, #e8d5f2 100%);
	border-radius: 12px;
	border: 1px solid #e1bee7;
	animation: slideIn 0.3s ease-out;
}

/* 团队人数筛选样式 */
.team-member-count-filters {
	margin-top: 16px;
	padding: 16px;
	background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
	border-radius: 12px;
	border: 1px solid #a5d6a7;
	animation: slideIn 0.3s ease-out;
}

.member-count-filter-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.member-count-filter-chip {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	border-radius: 20px;
	background: white;
	border: 2px solid #a5d6a7;
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 13px;
	font-weight: 500;
	color: #2e7d32;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
	position: relative;
}

.member-count-filter-chip:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.member-count-filter-chip.active {
	background: linear-gradient(135deg, #4caf50 0%, #388e3c 100%);
	border-color: #388e3c;
	color: white;
	box-shadow: 0 4px 12px rgba(76, 175, 80, 0.3);
}

.member-count-filter-chip.active .chip-icon {
	transform: scale(1.1);
}

.member-count-filter-chip.range-chip {
	flex-direction: column;
	align-items: center;
	padding: 10px 16px;
	gap: 4px;
}

.range-display {
	font-size: 11px;
	opacity: 0.9;
	margin-top: 2px;
}

.range-selector-dropdown {
	margin-top: 12px;
	padding: 12px;
	background: white;
	border-radius: 8px;
	border: 1px solid #c8e6c9;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	animation: slideIn 0.2s ease-out;
}

.range-options {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}

.range-option {
	padding: 8px 12px;
	border-radius: 8px;
	background: #f5f5f5;
	border: 1px solid #e0e0e0;
	text-align: center;
	cursor: pointer;
	transition: all 0.2s ease;
	font-size: 12px;
	color: #424242;
}

.range-option:hover {
	background: #e8f5e9;
	border-color: #a5d6a7;
	color: #2e7d32;
}

.range-option.active {
	background: linear-gradient(135deg, #4caf50 0%, #388e3c 100%);
	border-color: #388e3c;
	color: white;
	font-weight: 600;
	box-shadow: 0 2px 6px rgba(76, 175, 80, 0.3);
}

.role-filter-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.role-filter-chip {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	border-radius: 20px;
	background: white;
	border: 2px solid #e1bee7;
	cursor: pointer;
	transition: all 0.3s ease;
	font-size: 13px;
	font-weight: 500;
	color: #6a1b9a;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.role-filter-chip:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.role-filter-chip.active {
	background: linear-gradient(135deg, #9c27b0 0%, #7b1fa2 100%);
	border-color: #7b1fa2;
	color: white;
	box-shadow: 0 4px 12px rgba(156, 39, 176, 0.3);
}

.role-filter-chip.active .chip-icon {
	transform: scale(1.1);
}

/* 筛选按钮动画 */
@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 手机端适配 */
@media (max-width: 768px) {
	.challenge-type-filters,
	.team-role-filters {
		margin-top: 12px;
		padding: 12px;
	}
	
	.filter-section-title {
		font-size: 13px;
		margin-bottom: 10px;
	}
	
	.filter-title-icon {
		font-size: 14px;
	}
	
	.challenge-filter-chips,
	.role-filter-chips {
		gap: 6px;
	}
	
	.challenge-filter-chip,
	.role-filter-chip {
		padding: 6px 12px;
		font-size: 12px;
	}
	
	.chip-icon {
		font-size: 12px;
	}
}

@media (max-width: 480px) {
	.challenge-type-filters,
	.team-role-filters {
		margin-top: 10px;
		padding: 10px;
	}
	
	.filter-section-title {
		font-size: 12px;
		margin-bottom: 8px;
	}
	
	.filter-title-icon {
		font-size: 13px;
	}
	
	.challenge-filter-chips,
	.role-filter-chips,
	.member-count-filter-chips {
		gap: 4px;
	}
	
	.challenge-filter-chip,
	.role-filter-chip,
	.member-count-filter-chip {
		padding: 5px 10px;
		font-size: 11px;
		border-radius: 16px;
	}
	
	.team-member-count-filters {
		margin-top: 10px;
		padding: 10px;
	}
	
	.range-selector-dropdown {
		padding: 6px;
	}
	
	.range-options {
		grid-template-columns: repeat(2, 1fr);
		gap: 4px;
	}
	
	.range-option {
		padding: 5px 8px;
		font-size: 10px;
	}
	
	.chip-icon {
		font-size: 11px;
	}
}

/* 近期推送按钮样式 */
.header-actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

.recent-push-btn {
	background: rgba(255, 255, 255, 0.2);
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 8px;
	padding: 6px 10px;
	cursor: pointer;
	transition: all 0.3s ease;
	backdrop-filter: blur(10px);
}

.recent-push-btn:hover {
	background: rgba(255, 255, 255, 0.3);
	border-color: rgba(255, 255, 255, 0.5);
	transform: translateY(-1px);
}

.recent-push-btn:active {
	transform: translateY(0);
	background: rgba(255, 255, 255, 0.25);
}

.push-btn-content {
	display: flex;
	align-items: center;
	gap: 6px;
}

.push-icon {
	font-size: 14px;
}

.push-text {
	font-size: 12px;
	color: white;
	font-weight: 500;
}

.push-icon-wrapper {
	position: relative;
}

.push-badge {
	position: absolute;
	top: -8px;
	right: -8px;
	background: #ff4757;
	color: white;
	border-radius: 10px;
	padding: 2px 6px;
	font-size: 10px;
	font-weight: 600;
	min-width: 16px;
	text-align: center;
	line-height: 1.2;
}
</style>